5.1 Введение в Позиционирование

Этот раздел посвящен размещению блочных элементов HTML-разметки в рабочей области браузера с точностью до пиксела. До появления спецификации CSS-P, которая вошла в спецификацию CSS2, ничего подобного делать на HTML-страницах было нельзя. Некоторые наиболее пристрастные читатели могут спросить: «А как насчет элемента разметки LAYER ?». Во-первых, LAYER был введен Netscape практически одновременно с появлением CSS-P, а во-вторых, он поддерживается только браузерами Netscape.

Позиционирование и его программирование на JavaScript — это сплошное «минное поле» между двумя основными браузерами. При просмотре этих страниц следует отдавать себе отчет в том, что для каждого браузера загружается своя страница описания свойств позиционирования и программирования этих свойств.

До появления CSS-P единственным средством относительно точного позиционирования были таблицы. Они позволяли точно расположить компоненты HTML-страницы относительно друг друга на плоскости. CSS-P позволяет точно разместить элемент разметки не только относительно других компонентов страницы, но и относительно границ страницы.

Кроме того, CSS-P добавляет странице еще одно измерение — элементы разметки могут «наезжать» друг на друга.

При этом можно менять порядок «наезда» — перекладывать слои. Чтобы в этом убедиться, достаточно воспользоваться ссылкой из приведенного примера.

Но и это еще не все.

Слои можно проявлять.

Рис. 5.1. Позиционирование
Рис. 5.2. Позиционирование

Термин » слой » вместо «блочный элемент разметки» используется здесь по той причине, что он лучше отражает эффект, который достигается за счет позиционирования, а вовсе не в пику приверженцам Microsoft.

Теперь переходим к обсуждению атрибутов позиционирования.

Рис. 5.3. Позиционирование
Рис. 5.4. Позиционирование