Рассылка закрыта
Вы можете найти рассылки сходной тематики в Каталоге рассылок.
Рецепты HTML
| Информационный Канал Subscribe.Ru |
| http://html.krsk.ru |
Сегодня дается описание слоев, что это такое и зачем они нужны.
Слои
CSS дает возможность работы со слоями: фрагментами HTML, которые можно размещать на веб-странице путем наложения их друг на друга с точностью до пиксела. Синтаксис для работы со слоями разработан и одобрен в конце 1996 года в рабочем проекте консорциума "CSS Positioning (CSS-P)" Данный проект для позиционирования элементов практически одинаково поддерживается браузерами Internet Explorer 4.0 и Netscape 4.0 за исключением ряда мелких отличий. Однако объектные модели браузеров для динамического управления слоями с помощью JavaScript отличаются. В этом и кроется основная проблема для веб-разработчиков, которые используют слои в своих программах.
Основы
| Слой 1 наверху
Слой
1
Слой
2
Слой 2 наверху
Слой
1
Слой
2
|
Код HTML для примера показан ниже.
|
Пример 1. Создание слоев
|
Для создания слоев следует использовать тег 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, которое его прячет.
| <div style=""visibility:" hidden">Спрятанный слой</div> |
Динамическое управление отображением слоя позволяет создавать выпадающие
меню, анимацию на веб-странице, свертывающие и развертывающие окна
и многое другое.
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 |
| http://subscribe.ru/
E-mail: ask@subscribe.ru |
Отписаться
Убрать рекламу |
| В избранное | ||
