您好,登錄后才能下訂單哦!
CSS中的@import怎么用?針對這個問題,這篇文章詳細介紹了相對應的分析和解答,希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。
@import 是CSS@規則,用于從其他樣式表導入樣式規則。這些規則必須先于所有其他類型的規則,@charset 規則除外; 因為它不是一個嵌套語句,@import不能在條件組的規則中使用。
因此,用戶代理可以避免為不支持的媒體類型檢索資源,作者可以指定依賴媒體的@import規則。這些條件導入在URI之后指定逗號分隔的媒體查詢。在沒有任何媒體查詢的情況下,導入是無條件的。指定所有的媒體具有相同的效果。
引入CSS的方法有兩種,一種是@import,一種是link
@import url('地址');
<link href="地址" rel="stylesheet" type="text/css" />
現在絕大部分的網站都采用后一種link方式,原因在于
@import先加載HTML,后加載CSS
link先加載CSS,后加載HTML。
所以前者加載網頁會出現令瀏覽者以外的格式,后者則是帶格式的加載網頁。
@import 的幾種引入方式
@import 默認引入less方式讀取,出css之外:
@import "foo"; // foo.less 導入為less文件 @import "foo.less"; // foo.less 導入為less文件 @import "foo.php"; // foo.php 導入為less文件 @import "foo.css"; // 語句保持原樣,導入為css文件
屬性 | 作用 | 釋義 |
---|---|---|
reference | 使用該less文件但是不輸出它 | 使用@import (reference) 導入外部文件,導入的樣式不會添加到編譯輸出,除非該樣式被引用。 |
inline | 包括在源文件中輸出,但是不作處理 | 當一個css文件可能無法被less所兼容時 |
less | 將該文件視為less文件,無論擴展名是什么 | |
css | 將文件視為css文件,無論擴展名是什么 | |
once | 該文件僅可導入一次 (默認) | 文件只會被導入一次,后續的導入相同文件的語句會被忽略。 |
multiple | 該文件可以多次導入 | 文件重復被引入多次 |
optional | 當沒有發現文件時仍然編譯 | 避免導入不存在的less文件,如果沒有這個參數會報 File Error 錯誤 |
關于CSS中的@import怎么用問題的解答就分享到這里了,希望以上內容可以對大家有一定的幫助,如果你還有很多疑惑沒有解開,可以關注億速云行業資訊頻道了解更多相關知識。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。