Добрый день.
Сегодня дается описание слоев, что это такое и зачем они нужны.
Слои
CSS дает возможность работы со слоями: фрагментами HTML, которые
можно размещать на веб-странице путем наложения их друг на друга
с точностью до пиксела. Синтаксис для работы со слоями разработан
и одобрен в конце 1996 года в рабочем проекте консорциума "CSS
Positioning (CSS-P)" Данный проект для позиционирования элементов
практически одинаково поддерживается браузерами Internet Explorer
4.0 и Netscape 4.0 за исключением ряда мелких отличий. Однако объектные
модели браузеров для динамического управления слоями с помощью JavaScript
отличаются. В этом и кроется основная проблема для веб-разработчиков,
которые используют слои в своих программах.
Для создания слоев следует использовать тег DIV
или SPAN. Эти теги взаимозаменяемы и различаются
лишь внешним видом в браузере. Если требуются отступы до и после
текста, следует использовать элемент DIV.
При размещении текста внутри параграфа применяется тег SPAN.
Тип позиционирования определяется параметром position,
положение элемента двумя координатами top
и left, а порядок слоя значением z-index.
Позиционирование слоя
Свойство position может принимать одно из трех значений: static
(статическое), absolute (абсолютное)
и relative (относительное). Параметр
static по умолчанию не оказывает никакого
влияния на расположение слоев.
При абсолютном позиционировании слой размещается относительно левого
верхнего угла окна документа. В случае размещения слоя внутри другого,
абсолютные координаты считаются от левого верхнего угла родительского
слоя.
Кроме тегов DIV и SPAN абсолютное позиционирование поддерживают
следующие элементы:
APPLET, INPUT, BUTTON, OBJECT, SELECT, FIELDSET, IFRAME, TABLE,
IMG, TEXTAREA.
Параметр position: relative используется
для смещения слоя относительно родительского элемента. Установка
этого значения не изменяет размещение элемента, но если установлены
значения свойств top или left,
то слой смещается от своего нормального положения в документе.
Положение слоя
В то время как свойство position указывает
тип системы координат, параметры top
и left определяют точную позицию слоя.
Значения этих параметров могут определяться в процентном отношении
или пикселах, принимать положительные и отрицательные величины.
Это дает возможность размещать контент выше или ниже на странице
независимо от физической позиции кода HTML. То есть, в верхней части
страницы можно поместить слой, который описан внизу HTML-документа.
Положение слоя можно менять динамически с помощью JavaScript. Это
позволяет изменять расположение элементов уже после загрузки страницы.
Подобная техника применяется при создании баннеров, игр, выпадающих
меню и др.
Свойство z-index
Свойство z-index определяет порядок
слоев, или их перекрытие по отношению к другим слоям. По умолчанию
все слои позиционированы со значением z-index
равным нулю. Другие слои могут размещаться ниже путем установки
отрицательного значения z-index (рис.
1). Для слоев, у которых z-index не
установлен, это значение назначается неявно в соответствии с их
положением в документе. Поэтому слой, который помещен в документ
позже, размещается выше остальных элементов, позиционированных ранее.
Рис. 1. Расположение слоев
В примере, приведенном в начале, показано использование параметра
z-index для изменения положения слоев
относительно друг друга.
Свойство visibility
Для отображения или скрытия слоя используется параметр visibility.
Он может принимать значения visible,
установленное по умолчанию, для показа слоя, и hidden,
которое его прячет.
Динамическое управление отображением слоя позволяет создавать выпадающие
меню, анимацию на веб-странице, свертывающие и развертывающие окна
и многое другое.
Партнерская программа для авторов сайтов
Horse XXI Russia - российское представительство Системы Бронирования Отелей
Horse XXI (www.horse21.net) предоставляет
пользователям Интернет уникальную возможность - бронировать тысячи отелей по
всему миру в реальном режиме времени прямо с сайта.
Предлагаются 2 способа участия в партнерской программе Horse21:
1. Партнер размещает любые из предлагаемых баннеров Horse21 на своем сайте,
баннерной сети, в рассылке и т.д. Клиент заходит с сайта партнера на www.horse21.ru
и бронирует гостиницу. Вы получаете 4 EUR за каждое реализованное бронирование.
Автоматическая регистрация участников находится здесь: http://affiliation.horse21.ru.
Размер комиссионного вознаграждения обсуждается.
2. Партнер размещает у себя формы бронирования отелей Horse21. Подробнее о
формах бронирования:
a. гибко настраиваются под интерфейс и стили сайта партнера.
b. реализованы на фреймовой технологии, что позволяет клиентам пользоваться
услугами по бронированию, не покидая сайта партнера.
c. настройка под интерфейс партнерского сайта и демонстрационные версии партнерского
сайта с установленной формой бронирования - предоставляются абсолютно бесплатно.
В этом способе сотрудничества сочетается возможность партнеров удачно расширить
сферу услуг, предоставляемых сайтом пользователям, а также возможность самого
партнера заработать. Комиссионные ставки, по формам бронирования могут достигать
4% от суммы, уплаченной клиентом в отеле. Время компиляции индивидуального фрейма
бронирования для каждого ресурса колеблется в пределах нескольких часов.
Среди партнеров Horse21 - www.lycos.ru, www.kontorakuka.ru, www.fly.ru, и другие
уважаемые ресурсы. За более подробной информацией и с предложениями, пожалуйста,
обращайтесь pr@horse21.net. Страница партнерской
программы Horse21 - http://affiliation.horse21.ru.
Copyright Влад Мержевич. По всем вопросам пишите мне по адресу inferos@mail.ru