CSS 文件的4種引入方式

時間 2019-12-10

標籤 css 文件引入方式欄目 CSS 简体版

原文原文鏈接

（1）連接式：在網頁的<head></head>標籤對中使用<link>標記來引入外部樣式表文件，使用html規則引入外部css (用得比較多) :css

　　　　　　　　　　<link href="./mystyle.css" rel="stylesheet" type="text/css"/>html

（2）導入式：將一個獨立的.css文件引入HTML文件中，導入式使用CSS規則引入外部CSS文件，<style>標記也是寫在<head>標記中，使用的語法以下：測試

@import"mystyle.css"; 此處要注意.css文件的路徑htm

</style>ip

比較：link引用和import引用區別是：link是html加載前就引用，而import是html加載後才引用。舉例，採用impor引用，會先顯示無樣式的頁面，而後再把樣式放進去。若是用JavaScript動態引用CSS，得使用link引用方式纔可實現。文檔

（3）內聯css文件，直接在header 裏面寫css，如：import

這種方法的使用狀況要少的多，最長見得就是訪問量大的門戶網站。或者訪問量較大的企業網站的首頁。與第一種方法比起來，優勢突出，弊端也明顯。優勢：速度快，全部的CSS控制都是針對本頁面標籤的，沒有多餘的ＣＳＳ命令；再者不用外鏈ＣＳＳ文件。直接在ＨＴＭＬ文檔中讀取樣式。缺點就是改版麻煩些，單個頁面顯得臃腫，ＣＳＳ不能被其餘ＨＴＭＬ引用形成代碼量相對較多，維護也麻煩些。可是採用這種方法的公司大多有錢，對他們來講用戶量是關鍵，他們不缺人進行復雜的維護工做。引用

（4）直接在標籤裏面寫樣式

不常常改的地方。能夠一用，，可是仍是謹慎使用，很不符合大衆。