Иллюстрированный самоучитель по Adobe Dreamweaver MX

Управление таблицами стилей

Кроме манипуляций над отдельными стилями, Dreamweaver предоставляет возможность управлять целыми таблицами стилей. Вы можете редактировать их, создавать и удалять, а также присоединять к документу внешние таблицы и экспортировать внутренние таблицы во внешний файл.

Как правило, нужда редактировать саму таблицу стилей возникает нечасто. Dreamweaver предоставляет достаточно мощные средства правки стилей по отдельности, вне зависимости от того, где они сохранены. Но если все же вам понадобится отредактировать таблицу стилей, выполните одно из нижеперечисленных действий:

  • нажмите кнопку Edit Style Sheet (рис. 10.29) в правом нижнем углу панели CSS Styles;
  • дважды щелкните по свободному пространству списка стилей (он должен находиться в режиме правки стилей, т. е. должен быть включен переключатель Apply Styles);
  • выберите пункт Edit Style Sheet в контекстном или дополнительном меню панели CSS Styles;
  • выберите пункт Edit Style Sheet в подменю CSS Styles контекстного меню окна документа или меню Text.

Иллюстрированный самоучитель по Adobe Dreamweaver MX › Каскадные таблицы стилей › Управление таблицами стилей
Рис. 10.29. Кнопка Edit Style Sheet панели CSS Styles

После этого на экране появится диалоговое окно Edit Style Sheet, показанное на рис. 10.30.

Большую часть этого диалогового окна занимает список стилей, определенных во внутренней таблице (если таковая есть), и внешних таблиц стилей, привязанных к этой странице. Вы видите, что этот список в нашем случае содержит два пункта. Нижний пункт обозначает стиль, переопределяющий тег <BODY>. (Помните, мы задали для тела документа светло-желтый цвет Верхний же пункт обозначает внешнюю таблицу стилей 10.2.css, привязанную к нашей странице. Заметьте, что этот пункт помечен специальным значком.

Под списком находится небольшое текстовое поле, где выводится код определения выбранного в списке стиля. Так что вы сразу можете видеть, что за стиль попал вам под руку… т. е. под мышку.

Иллюстрированный самоучитель по Adobe Dreamweaver MX › Каскадные таблицы стилей › Управление таблицами стилей
Рис. 10.30. Диалоговое окно Edit Style Sheet

Левее списка находятся пять кнопок. Перечислим их по порядку.

Кнопка Link позволяет привязать к странице внешнюю таблицу стилей. Если вы на нее нажмете, на экране появится диалоговое окно Link External Style Sheet, показанное на рис. 10.31. В поле ввода File/URL введите имя файла внешней таблицы стилей, которую вы хотите привязать к своей странице. Если вы не хотите вводить ее вручную, щелкните кнопку Browse и выберите нужный файл в диалоговом окне Select File. После этого нажмите кнопку ОК для привязки таблицы стилей или Cancel – для отказа от этого.

Иллюстрированный самоучитель по Adobe Dreamweaver MX › Каскадные таблицы стилей › Управление таблицами стилей
Рис. 10.31. Диалоговое окно Link External Style Sheet

В диалоговом окне Link External Style Sheet имеется также группа переключателей Add As. Переключатель Link (включен по умолчанию) выполняет обычную привязку таблицы стилей с помощью тега <LINK>; это, собственно, делается почти всегда. А переключатель Import позволяет вам импортировать внешнюю таблицу стилей, т. е. перенести все содержимое внешней таблицы стилей во внутреннюю. Однако такой возможностью пользоваться не рекомендуется, поскольку команда CSS @import, с помощью которой выполняется импортирование, поддерживается далеко не всеми программами Web-обозревателей. А, кроме того, при импортировании возможен неразрешимый конфликт стилей, когда во внутренней и внешней таблицах оказывается два стиля с одинаковым именем. (При импортировании механизм "каскадности" не работает.)

Если Вы заметили ошибку, выделите, пожалуйста, необходимый текст и нажмите CTRL + Enter, чтобы сообщить об этом редактору.