Создание и продвижение сайтов, материалы веб-мастеру!
Способы заработка, свой бизнес в интернете!

Подписка на обновления сайта с помощью RSS

Подписка с помощью RSS
(читателей: 955)

Мой LiveJournal Мой Я.ру Мой FaceBook Мой Twitter

Читать в соц. сетях:

Куда вложить деньги - инвестирование в ПАММ-счетаПассивный доход за счёт инвестирования Куда сегодня можно вложить деньги

Инструкции и методы решения различных задач

Раздел "Инструкции и методы"

Основа данного раздела - это пошаговые описания решений определённых задач в сайтостроении (вёрстка, web-дизайн, программирование и прочее), примеры решения различных трудностей с помощью полезного софта, а также некоторые другие интересные материалы

Все инструкции и методы одним списком

Использование средств CSS и jQuery для центрирования блока

Блок по центру

Если вы уже занимались версткой веб-страниц, то вам, вероятнее всего, приходилось сталкиваться с проблемой центрирования блоков (div) по горизонтали и вертикали. Самый применяемый метод центрирования – это, несомненно, стили CSS.

Для начала вы должны определиться с шириной и высотой используемого блока. При горизонтальном центрировании с помощью CSS необходимо поставить для левой и правой границы значение auto (как показано на рисунке).

горизонтальное центрирование

Данный способ используется для блочных элементов, таких как div, p, h1 и др. Для применения метода к гиперссылкам или изображениям, требуется использовать дополнительное правило – display:block.

Немного замысловатей будет выглядеть реализация одновременно горизонтального и вертикального центрирования.

одновременное центрирование

Абсолютное позиционирование, указанное на рисунке, отделяет блок от среды, устанавливая его расположение по отношению к окну браузера. Слева и сверху устанавливается значение 50%, в результате чего блок разместится в центре окна. Последняя строчка кода в примере смещает блок влево и вверх, ввиду отрицательных значений, для наилучшего расположения.

Как вы видите, все легко и просто. Но лишь до тех пор, пока блок имеет фиксированный размер. При других раскладах не обойтись без центрирования с помощью jQuery.

центрирование jQuery

Каждый раз, когда пользователь изменяет размер окна, функция высчитывает ширину. Этот способ весьма удобен, но работать он будет только с включенным JavaScript.

Хотите создать свой бизнес, но не знаете с чего начать? Читайте о том, как сделать готовый бизнес-план на сайте Financial-Lawyer.

Если Вам понравился данный материал, Вы можете подписаться на получение новых публикаций сайта с помощью RSS-ленты или E-mail-рассылки:

Подписка на обновления сайта с помощью RSS

Введите свой e-mail:

RSS-подписчиков: 955 | E-mail-подписчиков: 691


Спасибо Вам за добавление данной страницы в социальные сервисы:


Ещё инструкции и методы...


Задать вопрос или оставить комментарий

Вы можете поделиться своим мнением по теме или задать возникшие вопросы ниже в комментариях. Спасибо!

Чтобы получить подробный ответ на ряд возникших вопросов или если требуется детальная помощь в решении какой-либо задачи, можно воспользоваться данной формой. Ответы на вопросы, заданные через указанную форму, публикуются в разделе "Вопросы пользователей".


Отправить комментарий
Содержание этого поля является приватным и не предназначено к показу.
КАПЧА
Этот вопрос задается для того, чтобы выяснить, являетесь ли Вы человеком или представляете из себя автоматическую спам-рассылку.
1 + 0 =
Решите эту простую математическую задачу и введите результат. То есть для 1+3, введите 4.

Copyright © 2007-2012 Николай Мурашкин | Хостинг сайта

Копирование, а также любое другое подобное использование материалов без ссылки на сайт NikMurashkin.RU строго запрещено!

тИЦ и Page Rank сайта