CSS 全稱級聯樣式表 (CascadingStyle Sheets)，在實際應用中，一般有以下三種級聯方式。
1.外聯式
外聯式樣式表中，CSS代碼作爲文件單獨存放，如以 style.css 文件包含所有樣式。在HTML中的外部級聯採用 <link> 標記或者 @import 語句來引入。示例代碼如下：
<link rel="stylesheet"href="style.css" type="text/css" /> //link 鏈接 @importurl("style.css"); //@import 導入
網頁中 CSS 文件的外部引用有 link 和 @import 兩種方式，對於宏觀上的頁面展現是一樣的效果。當然，在本質上，他們不盡不同。
第一，link 是屬於 HTML 標記的範疇，@import 則是源於 CSS 一種樣式導入方式。link 不只可以外聯樣式表，還能夠設定 RSS 源地址，網頁的 favicon.ico 等。如：<LINK href="favicon.ico" type="image/x-icon"rel=icon>
<LINK href="favicon.ico"type="image/x-icon" rel="shortcut icon">但 @imort 只支持對 CSS 的導入。
第二，@import 支持高版本瀏覽器，但不兼容低版本瀏覽器，IE 5 以上才支持 @import 方式，但 link 則沒有版本的限制。
第三，link 與頁面同步加載，@import 需要在頁面加載完畢後才加載，會由於網速等原因，讀取緩慢，造成頁面閃爍的現象。
第四，link 是 DOM 對象，可以用 JavaScript 控制樣式的呈現，而對於 @import 則無法控制。
從實際應用來看，使用 link 和 @import 進行外部引用在效率上並沒有太大差別。如果需要減少對服務器的請求，可以採用內聯樣式表的方法。
導入會增加的你的頁面大小鏈接不會
但是導入可以避免鏈接那樣的過多頁面指向一個css文件
造成磁盤io不足速度下降的弊病
還有“href”連接的css是客戶端瀏覽你的網頁時先加載css溶於html語言結構之中，所以採取這種方式的網頁是你預期好的理想的展現形態；
而“導入”則是客戶端再瀏覽你的網頁時，客戶端先加載獲取網頁的html結構呈現出來，網速及其慢的情況之下，瀏覽者就會先看到一個沒有css的html頁面，可能及其難看，待接下來css再導入導html結構中，客戶端纔會最終展現出加載完css的html理想效果頁面。
ps：當然一個頁面幾十百來K這兩者對於網速慢的瀏覽者也幾乎沒什麼影響，除非瀏覽者的網速極其慢，你的網頁特別大，就會出現這兩者的差別。爲了周全起見，這就解釋了爲什麼現在網站絕大多數用“連接”而不是“導入”了
2.內聯式
門戶網站的CSS代碼通常採用嵌入式，即通常所說的內聯方式 (Inline Style)，其使用 <style> 標記將樣式定義爲內部塊對象。示例代碼如下：
<style type="text/css"><!-- body{font-family:Arial,Helvetica,sans-serif;} --> </style>
內聯 CSS 可以有效減少 HTTP 請求，提升頁面性能，緩解服務器壓力。由於瀏覽器加載完 CSS 才能渲染頁面，因此能防止 CSS 文件無法讀取而造成頁面裸奔的現象。
3.嵌入式
最初級的CSS寫法即把代碼直接添加於所修飾的標記元素。示例代碼如下：
<divstyle="font-family:Arial,Helvetica,sans-serif;">芒果</div>
這樣做雖然更爲直觀，但很大程度上加大了頁面體積，不符合結構與表現分離的設計思想。
總體而言，外聯和內聯各有優點，可綜合實際情況選擇適合的級聯方式。
總結一下：外聯優點：css在同一個文件中，當頁面需要修改的時候只需要修改一個文件即可，方便維護。
缺點：HTTP請求多，瀏覽器要加載完CSS才能渲染頁面，因此影響頁面的性能。
內置優點：內聯 CSS 可以有效減少 HTTP 請求，提升頁面性能，緩解服務器壓力。由於瀏覽器加載完 CSS 才能渲染頁面，因此能防止 CSS 文件無法讀取而造成頁面裸奔的現象。
缺點：每次修改css的時候需要修改多個頁面
Javascrip內聯和外置的區別其實也差不多
JavaScript文件外部加載的好處
統一定義JavaScript代碼，方便查看，方便維護。
使代碼更安全，可以壓縮，加密單個JavaScript文件。
瀏覽器可以緩存JavaScript文件，減少寬帶使用（當多個頁面同時使用一個JavaScript文件的時候，通常只需下載一次）。
JavaScript文件外部加載的注意事項
不要把JavaScript分爲多個文件，多個文件會增加服務器的負擔，增加服務器的HTTP請求。
一個JavaScript文件也會增大HTTP請求。
使用外部JavaScript和CSS
很多性能規則都是關於如何處理外部文件的。但是，在你採取這些措施前你可能會問到一個更基本的問題：JavaScript和CSS是應該放在外部文件中呢還是把它們放在頁面本身之內呢？
在實際應用中使用外部文件可以提高頁面速度，因爲JavaScript和CSS文件都能在瀏覽器中產生緩存。內置在HTML文檔中的JavaScript 和CSS則會在每次請求中隨HTML文檔重新下載。這雖然減少了HTTP請求的次數，卻增加了HTML文檔的大小。從另一方面來說，如果外部文件中的 JavaScript和CSS被瀏覽器緩存，在沒有增加HTTP請求次數的同時可以減少HTML文檔的大小。
關鍵問題是，外部JavaScript和CSS文件緩存的頻率和請求HTML文檔的次數有關。雖然有一定的難度，但是仍然有一些指標可以一測量它。如果一個會話中用戶會瀏覽你網站中的多個頁面，並且這些頁面中會重複使用相同的腳本和樣式表，緩存外部文件就會帶來更大的益處。
許多網站沒有功能建立這些指標。對於這些網站來說，最好的堅決方法就是把JavaScript和CSS作爲外部文件引用。比較適合使用內置代碼的例外就是網站的主頁，如Yahoo!和My Yahoo!。主頁在一次會話中擁有較少（可能只有一次）的瀏覽量，你可以發現內置JavaScript和CSS對於終端用戶來說會加快響應時間。
對於擁有較大瀏覽量的首頁來說，有一種技術可以平衡內置代碼帶來的HTTP請求減少與通過使用外部文件進行緩存帶來的好處。其中一個就是在首頁中內置 JavaScript和CSS，但是在頁面下載完成後動態下載外部文件，在子頁面中使用到這些文件時，它們已經緩存到瀏覽器了。
總結
內建：頁面顯示完整（不會裸奔），減少http請求次數，但頁面臃腫，加載較慢，
外鏈：加快html加載速度（相當於併發執行，但通常帶寬夠用，且頁面大小較小，增加的額外開銷反而較大），優點是子頁面可以複用。
實際中減少http連接請求數（如雪碧圖）。