Импортирование стилей

В контейнере <style> … </style> можно импортировать внешнюю таблицу стилей с помощью правила @import таблицы стилей, которое имеет следующий синтаксис:

@import url(URL-таблицы-стилей) список-имен-устройств;

Параметр URL-таблицы-стилей в функции задается также, как значение атрибута href в элементе link (см. 4.3.12.2), а список-имен-устройств задается так же, как значение атрибута media в элементе style (см. 4.3.12.1).

Это правило следует задавать в начале контейнера стилей или связываемой таблицы стилей перед заданием остальных правил.

Импортируемый файл с таблицей стилей оформляется так же, как и связываемый файл (см. 4.3.12.2).

В начале импортируемого или связываемого файла (или после правила @charset, если оно есть) может, в свою очередь, быть задана (с помощью правила @import) ссылка на другой импортируемый файл, что позволяет создавать взаимосвязанную структуру внешних таблиц стилей.

Пример 4.3.33. Импорт таблицы стилей:

<style type="text/css">

/* Импорт таблицы styles.css */

@import url("styles.css");

/* Дополнительное правило

для класса underline */

span.underline {font-weight: bold}

</style>

Файл styles.css имеет то же содержимое, что и файл styles.css в предыдущем примере. Для фрагмента документа HTML, приведенного в предыдущем примере, вывод Web-страницы будет иметь следующий вид: