Иллюстрированный самоучитель по Dreamweaver MX
Свободно позиционируемый абзац текста на странице 11.1.htm
Теперь рассмотрим таблицу стилей. В ней мы использовали множество новых атрибутов, которые сейчас и рассмотрим.
Этот атрибут делает элемент страницы свободно позиционируемым:
position: absolute;
Запомните его — он обязательно должен присутствовать в определении стиля любого свободного элемента. Если у вас что-то не работает, прежде всего, проверьте, задали ли вы для данного атрибута соответствующее значение.
У обычного фиксированного элемента названный атрибут установлен в значение static. Это же его значение по умолчанию.
Эти атрибуты задают, соответственно, горизонтальную и вертикальную координаты левого верхнего угла свободного элемента:
left: 50; top: 50;
В данный момент они заданы в пикселах, хотя вы можете использовать любую из поддерживаемых CSS единиц измерений. Имейте в виду, что данные атрибуты имеют силу только для свободно позиционируемых элементов, т. е. тех, у которых атрибут position установлен в значение absolute.
Примечание
Запомните, что координаты свободно позиционируемого элемента отсчитываются относительно родителя, а не относительно окна Web-обозревателя. Поскольку в нашем случае родителем является сама-страница, это несущественно, но вообще об этом забывать не следует.
А эти атрибуты задают, соответственно, ширину и высоту свободно позиционируемого элемента:
width: 200; height: 100;
Они также даны в пикселах, хотя могут быть заданы в любой другой из поддерживаемых CSS единиц измерения. И также имеют силу только у свободно позиционируемых элементов.
А теперь взгляните еще раз на рис. 11.1. Вы видите, что высота нашего свободного элемента заметно больше ста пикселов (сравните ее с шириной). Дело в том, что по умолчанию свободный элемент растягивается по вертикали, если его содержимое в нем не помещается. А у нас как раз такой случай. (Как уже говорилось, вы можете задать другое поведение, но об этом позже.)
background-color: #00FF00;
Здесь специально задан зеленый фон для свободно позиционируемого элемента, чтобы он был заметнее.
Forekc.ru
Рефераты, дипломы, курсовые, выпускные и квалификационные работы, диссертации, учебники, учебные пособия, лекции, методические пособия и рекомендации, программы и курсы обучения, публикации из профильных изданий