Главная | Обратная связь | Поможем написать вашу работу!
МегаЛекции

Визуальное форматирование




Свойство position

Свойство positionэлемента позволяет определить способ его позиционирования на странице: статический, относительный или абсолютный.

Значения static, relative и absolute свойства position определяют соответствующий способ позиционирования элемента, который, в конечном счете, складывается из значения указанного свойства элемента, его положения в иерархической структуре документа, местом его определения в исходном файле HTML и значениями его свойств top и left. Эти последние свойства определяют смещение вниз и вправо левого верхнего угла блока отображения элемента.

Абсолютное позиционирование

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

Чтобы определить точку отсчета местоположения элемента следует найти его ближайшего родителя, позиционированного абсолютно или относительно. Положение левой верхней вершины блока этого элемента и будет точкой отсчета для абсолютно позиционированного элемента. Если процесс поиска подобного родителя (следует пропускать все позиционированные статически элементы) дойдет до элемента <BODY>, то тело документа и будет тем элементом, относительно которого позиционируется исходный элемент.

Следующий фрагмент страницы HTML иллюстрирует абсолютное позиционирование элемента:

<SPAN STYLE="position:static;

background-color:#90EE90">

Родитель, позиционированный статически!

<IMG SRC="Ж.gif" STYLE="position:absolute; top:60px; left:60px;">

</SPAN>

а) б)

в) г)

Поделиться:





Читайте также:





Воспользуйтесь поиском по сайту:



©2015 - 2024 megalektsii.ru Все авторские права принадлежат авторам лекционных материалов. Обратная связь с нами...