CSS 四種引入樣式表
CSS 有四種方式引入樣式表，如下：
- 外部樣式表
- 內部樣式表
- 行內樣式表
- 導入樣式表
外部樣式表優缺點
優點
- 實現了結構與表現的代碼完全分離
- 方便復用及維護
- 因為分離到各自獨立的文件中，讓 HTML 文件大小大幅減少了，從而讓頁面結構更容易被程序員和網絡爬蟲讀懂
- 對搜索引擎友好，讓搜索引擎給頁面評分更高，有利於頁面搜索引擎排名
- 外部樣式表在用戶首次訪問后就被緩存到用戶電腦上，下次訪問無需加載
缺點
如果樣式很多，CSS 文件會變的很大查找起來不方便。此外，多一個 CSS 文件就多一次 HTTP 請求，在訪問量大的網站中會加重服務器壓力
內部樣式表優缺點
優點
與外部樣式表相比，內部樣式表的主要優點是減少了一個文件也就減少了一次 HTTP 請求
缺點
由於內部樣式表是寫在 HTML 文件中的，導致頁面不純凈、文件體積大、不利於網絡爬蟲獲取信息、不利於維護、頁面之間無法共享樣式
行內樣式表優缺點
優點
- 沒有了樣式表文件，在某些時候可以提升效率
- 使用 style 屬性的樣式效果會最強，會覆蓋掉其他引入方式的相同樣式效果
缺點
- 多個元素難以共享樣式，不利於代碼復用
- HTML 和 CSS 代碼混雜，不利於程序員和搜索引擎閱讀
@import 指令導入樣式表優缺點
優點
同外部樣式表
缺點
- 每多引入一個 CSS 文件就會對服務器增加一次鏈接請求，當訪問量較大需在維護性和性能上進行權衡
- @import 需要頁面完全載入后加載，如果網頁足夠大則可能出現閃爍，也就是在漫長的無樣式網頁加載后，CSS 樣式才開始加載。