CSS @import 規則

定義和用法

@import 規則允許您將樣式表導入另一張樣式表中。

@import 規則必須位于文檔頂部（但是在任何 @charset 聲明之后）。

@import 規則還支持媒體查詢，因此可以允許依賴媒體的導入。

實例

例子 1

把 "navigation.css" 樣式表導入當前樣式表中：

@import "navigation.css"; /* 使用字符串 */

或者

@import url("navigation.css"); /* 使用 url */

例子 2

只在媒體為 print 時導入 "printstyle.css" 樣式表：

@import "printstyle.css" print;

親自試一試

例子 3

只在媒體為 screen 且視口最大寬度 768 像素時導入 "mobstyle.css" 樣式表：

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

親自試一試

CSS 語法

@import url|string list-of-mediaqueries;

屬性值

值 描述
url|string url 或字符串，代表要導入的資源的位置。url 可以是絕對或相對的。
list-of-mediaqueries 以逗號分隔的媒體查詢列表，決定通過 URL 引入的 CSS 規則在什么條件下應用。

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 3.5