Добавление слоев

Шаблон HTML-кода слоя выглядит так:

<div style="Свойства слоя">

Содержимое слоя

</div>

Между открывающим и закрывающим тегом div определяютcz элементы, из которых состоит слой. Свойства слоя - это свойства таблицы стилей CSS. Записываются они согласно принятым правилам

свойство:значение

Естественно, свойства слоя могут также состоять из нескольких пар свойство-значение, которые отделяются друг от друга точками с запятой.

Основные из свойств слоя:

- Position – способ позиционирования

- Left расстояние от левого края:

- Width ширина слоя

- top расстояние от верхнего края

- height высота слоя

- background-color – фоновый цвет слоя

- background-image -фоновое изображение

- style – задание параметров отображения (стиль слоя).

- z-index –положение в пространстве относительно других слоев

- id – идентификатор слоя.

Остановимся поподробнее на каждом из свойств.

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

Позиционирование по горизонтали задается свойством left, путем задания отступа по оси X левого верхнего угла слоя относительно точки отсчета, которая определяется свойством Position

Синтаксис:

{left: значение}

Допускается указывать эту величину в разных единицах измерения.

- n px

- n %

- auto

- число

Можно подстраховаться и принудительно задать в качестве единиц измерения пиксели:

left:50px.

Вертикальное позиционирование

Позиционирование по вертикали задается свойством top, атрибут позволяет задать Y-координату левого верхнего угла слоя относительно точки отсчета, которая определяется свойством Position.

Синтаксис:

{top: значение}

Допускается указывать эту величину в разных единицах измерения.

- n px

- n %

- auto

- число

Задание высоты слоя

Свойство height позволяет задать высоту слоя в окне браузера:

Синтаксис:

{height: значение}

Допускается указывать эту величину в разных единицах измерения.

- n px

- n %

- auto

- число

Задание ширины слоя

Свойство width позволяет задать ширину слоя в окне браузера:

Синтаксис:

{width: значение}

Допускается указывать эту величину в разных единицах измерения.

- n px

- n %

- auto

Если указанная ширина слоя меньше, чем ширина картинок, таблиц и прочих неразрывных элементов, ширина слоя будет определяться наиболее широким элементом.