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

Статья
08/11/2011

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

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

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

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

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

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

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

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

Примечание

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

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

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

Задачи

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

Поля

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

MARGIN-TOP: 50px; margin-bottom:50px

Примечание

Значения полей могут быть положительными или отрицательными.

Внутренние поля

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

PADDING-TOP: 50px; PADDING-BOTTOM:50px

Примечание

Значения полей должны быть положительными.

Границы

Следующие атрибуты определяют границу прямоугольной области, окружающей элемент.

Выберите край, подлежащий изменению
Задает край границы, подлежащий форматированию. Выберите Все, Сверху, Снизу, Слева или Справа. Если стиль границы не выбран, код в стиль не добавляется.
Стиль
Задает стиль, применяемый к указанным границам. Выберите <не задано>, нет, сплошная линия, двойная линия, сплошная, с тенью, узорная, с тенью, вовнутрь или наружу. Например, если в качестве границы выбрано значение Сверху, а в качестве стиля выбрано значение сплошная линия, добавляется следующий код:

BORDER-TOP-STYLE:solid
Width
Задает ширину указанной границы. Выберите <не задано> (параметр не задан), тонкая, средняя, толстая или другая. Если выбрано значение другая, станут доступны дополнительные поля, в которых можно задать число и выбрать единицы измерения: px (по умолчанию), pt, pc, mm, cm, in, em, ex или %. Например, если при выборе края использовано значение Сверху, при выборе стиля — значение Сплошная линия, а при выборе ширины — значение Другое, в поле введено значение 50 и приняты единицы измерения по умолчанию, добавится следующий код.

BORDER-TOP:50px solid
Color
Устанавливает цвет границы в данном стиле. Выберите цвет из раскрывающегося списка или нажмите кнопку с многоточием (...), чтобы открыть диалоговое окно Палитра цветов и выбрать дополнительные цвета. Например, если для края выбрано значение Сверху, в качестве стиля выбрано значение сплошная линия и в качестве цвета — значение Синий, то добавляется следующий код:

BORDER-TOP:blue solid