Правило @import в CSS

  • Предыдущая страница
  • Следующая страница

Определение и использование

Правило @import позволяет импортировать таблицы стилей в другую таблицу стилей.

Правило @import должно располагаться в верхнем разделе документа (но после любого объявления @charset).

Правило @import поддерживает медиа-запросы и позволяет импортировать таблицы стилей в зависимости от медиа-типа.

Пример

Пример 1

Импортирует таблицу стилей "navigation.css" в текущую таблицу стилей:

@import "navigation.css"; /* Использование строки */

или

@import url("navigation.css"); /* Использование URL */

Пример 2

Импортирует таблицу стилей "printstyle.css", только когда медиа-тип equals print:

@import "printstyle.css" print;

Попробуйте сами

Пример 3

Импортирует таблицу стилей "mobstyle.css", только когда медиа-тип equals screen и максимальная ширина окна equals 768 пикселей:

@import "mobstyle.css" screen and (max-width: 768px);

Попробуйте сами

Грамматика CSS

@import url|string list-of-mediaqueries;

Значение свойства

Значение Описание
url|string URL или строка, представляющая положение ресурса, который нужно импортировать. URL может быть абсолютным или относительным.
list-of-mediaqueries Список медиа-запросов, разделенных запятыми, определяет, при каких условиях применяются правила CSS, вводимые через URL.

Поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает этот свойство.

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 3.5
  • Предыдущая страница
  • Следующая страница