Свойства позиции

В этом разделе мы рассмотрим свойства, касающиеся позиционирования элементов, которые были определены в стандарте CSS 2, это position, left, right, top, bottom и z-index.

Свойство position устанавливает способ позиционирования элемента относительно окна браузера или других объектов документа. На практике часто используются два его значения: relative и absolute.

В случае relative, заданного в качестве значение, положение элемента устанавливается относительно родителя. Добавление свойств left, top, right и bottom изменяет позицию элемента и сдвигает его в ту или иную сторону от родителя, в зависимости от применяемых значений этих свойств (в том числе и отрицательных).

Значение absolute указывает, что элемент позиционирован абсолютно. В этом случае его размер не учитывается в прорисовке документа, т.е. он не существует в обычном потоке прорисовки документа. Положение элемента задается свойствами left, top, right и bottom относительно документа или ближайшего предка с позицией relative или absolute.

Абсолютно позиционированные элементы могут накладываться друг на друга в документе, имитируя тем самым третье измерение, перпендикулярное экрану, или так называемую ось Z. Для решения конфликта взаимного расположения абсолютно позиционированных элементов и их наложения друг на друга, существует CSS-свойство z-index. Оно принимает любое целочисленное значение, положительное или отрицательное. Большее значение означает отображение элемента поверх всех остальных, т.е. выше по оси Z, меньшее – ниже.

Абсолютное позиционирование элементов следует применять только в случаях крайней необходимости и не следуем им злоупотреблять.








Дата добавления: 2015-07-07; просмотров: 525;


Поиск по сайту:

При помощи поиска вы сможете найти нужную вам информацию.

Поделитесь с друзьями:

Если вам перенёс пользу информационный материал, или помог в учебе – поделитесь этим сайтом с друзьями и знакомыми.
helpiks.org - Хелпикс.Орг - 2014-2024 год. Материал сайта представляется для ознакомительного и учебного использования. | Поддержка
Генерация страницы за: 0.005 сек.