Диалоговое окно "Построитель стилей", страница "Положение"

Статья
08/11/2011

Страница Положение диалогового окна Построитель стилей позволяет определить атрибуты положения в таблице каскадных стилей (CSS). Эти атрибуты можно применять непосредственно к HTML-элементам, либо же их можно добавить к правилам стилей CSS.

Применение атрибутов положения непосредственно к HTML-элементам на странице

Откройте HTML-документ в режиме Конструктора и выберите элемент для форматирования.
Выберите в меню Формат пункт Стиль, чтобы открыть диалоговое окно Построитель стилей.
Нажмите Положение в левой области диалогового окна Построитель стилей.

В правой области появится диалоговое окно Построитель стилей | Положение.

При применении стилей к элементам, выбранным в режиме разработки, атрибуты стиля CSS встраиваются в разметку HTML для этих элементов. Перейдите в режим редактирования кода HTML для просмотра вставленных атрибутов нового стиля.

Добавление атрибутов позиционирования в правило стиля CSS, определенное во внешней таблице стилей

Откройте существующую внешнюю таблицу стилей и поместите курсор внутрь фигурных скобок ("{ }"), следующих за селектором нужного правила стиля.
Нажмите кнопку Построить стиль в меню Стили, чтобы открыть диалоговое окно Построитель стилей.
Нажмите Положение в левой области диалогового окна Построитель стилей.

В правой области появится диалоговое окно Построитель стилей | Положение.

Примечание

Меню Стили появляется в том случае, когда редактируется внешняя таблица стилей CSS.Команда Построить стиль в меню Стили становится доступной при помещении точки вставки между фигурными скобками, следующими за селектором правила стилей.

Класс стиля CSS, определенный во внешней таблице стилей, может быть применен к элементу в области <BODY> веб-страницы путем записи селектора стиля CSS в свойство CLASS этого элемента.

Параметры, доступные на странице Положение диалогового окна Построитель стилей.

Задачи

Элементы пользовательского интерфейса

Вариант положения

Устанавливает режим, определяющий доступные далее поля позиционирования. Выберите в выпадающем меню один из следующих вариантов.

<Не задано>
Если значение атрибута — <Не задано>, код в стиль не добавляется.
Положение в нормальном потоке
Положение элемента не изменяется; можно задать высоту и ширину. При выборе значения обычное будет вставлена следующая разметка CSS:

POSITION:static

Примечание

Область просмотра, расположенная рядом с селектором Вариант положения, обновляется в соответствии с выбранным режимом.
Смещение от нормального потока
Позволяет задать верхнюю и левую позиции элемента относительно его обычного положения; можно указать высоту и ширину. Обычное положение элемента — это его положение до применения стиля. При выборе значения смещение от обычного будет вставлена следующая разметка CSS:

POSITION:relative
абсолютное позиционирование
Позволяет задать для элемента абсолютное положение верхней точки, абсолютное положение левой точки, Z-индекс, высоту и ширину. Как правило, абсолютное позиционирование используется для элементов, которые нужно закрепить в заданном положении. Например, можно использовать абсолютное позиционирование для логотипа, чтобы он не перемещался при добавлении и редактировании других элементов. При выборе значения абсолютное будет вставлена следующая разметка CSS:

POSITION:absolute

Если задан вариант положения, доступны следующие параметры.

Top
Устанавливает положение верхнего края элемента либо как абсолютное значение, либо как значение относительно его обычного положения. Введите значение и выберите единицы измерения (px, pt, pc, mm, cm, in, em, ex или %). Единица измерения по умолчанию — px. Например, при вводе значения 5 и использовании единиц измерения по умолчанию будет вставлена следующая разметка CSS:

TOP:5px

Примечание

Этот параметр доступен при выборе значения смещение от обычного из списка Вариант положения.
Left
Устанавливает положение левого края элемента либо как абсолютное значение, либо как значение относительно его обычного положения. Введите значение и выберите единицы измерения (px, pt, pc, mm, cm, in, em, ex или %). Единица измерения по умолчанию — px. Например, при вводе значения 5 и использовании единиц измерения по умолчанию будет вставлена следующая разметка CSS:

LEFT:5px

Примечание

Этот параметр доступен при выборе значения смещение от обычного из списка Вариант положения.
Height
Задает высоту элемента. Введите значение и выберите единицы измерения (px, pt, pc, mm, cm, in, em, ex или %). Единица измерения по умолчанию — px. Например, при вводе значения 5 и использовании единиц измерения по умолчанию будет вставлена следующая разметка CSS:

HEIGHT:5px
Width
Задает ширину элемента. Введите значение и выберите единицы измерения (px, pt, pc, mm, cm, in, em, ex или %). Единица измерения по умолчанию — px. Например, при вводе значения 5 и использовании единиц измерения по умолчанию будет вставлена следующая разметка CSS:

WIDTH:5px
Z-Index
Задает z-порядок элемента. Z-порядок определяет отображение перекрывающихся элементов; элементы с более высоким значением z-порядка отображаются перед элементами с меньшим z-порядком. Чтобы присвоить элементу более высокий z-порядок, введите положительное число для получения результата, аналогичного следующему примеру:

Z-INDEX:99

Примечание

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

Примечание

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