1、樣式剖析
一個樣式由兩部分組成，網頁元素（Selector 選取器）和格式化指令（Declaration Block 聲明塊）。選取器可能是大標題、一段文本、一張照片等。聲明塊可以使文本變藍、給段落加邊框等。如：
| 1234 | p { color: red; font-size: 12px;} |
2、理解樣式表
可以把樣式放到網頁檔案的內部或外部，或者混合使用。
外部樣式表的好處：獨立檔案可被瀏覽器緩衝，使網頁開啟更快；樣式集中更便於修改；更改一處，其他使用此樣式的網頁也同步修改了。
3、內部樣式表
放在HTML的<style>標籤中，<style>標籤一般放在<head>標籤中。
也可以使用HTML的style屬性在標籤內直接定義樣式，這種樣式稱為行內樣式。
4、外部樣式表
檔案一般使用.css作為副檔名。一個網頁的樣式表可以根據用途分為多個檔案，如公用樣式表global.css，表單樣式表form.css等。
外部樣式表只包含CSS聲明（屬性、值），不包含<style>，因為<style>是HTML標籤。
在HTML中引入外部樣式表可以使用<link>標籤或<style>標籤。<link>標籤的格式如下：
| 1 | <link rel="stylesheet" type="text/css" href="css/global.css" /> |
其中：rel為連結類型，type為資料類型（文字檔，包含CSS），href為CSS檔案的位置，即URL。
使用<style>標籤，在內部使用CSS的import指令，格式如下：
| 123 | <style type="text/css">@import url(css/global.css);</style> |
在外部樣式表中也可以使用import指令引入其他外部樣式表檔案。
內部樣式表的樣式一般放到引用外部樣式表的後面。
5、檢驗CSS
W3C推出了線上檢測檢驗的工具:http://jigsaw.w3.org/cssvalidaor/，Firefox的JavaScript控制台也有相應的提示，Html Validator外掛程式也可用於檢測。
6、清除快取
瀏覽器會緩衝網頁圖片、外部樣式表檔案等，如果編寫外部樣式表時樣式不起作用，可能是瀏覽器緩衝了相應的檔案，清除方法如下：
在瀏覽器的設定中去掉緩衝，或者在重新整理時按Ctrl+滑鼠點擊重新整理（Reload)按鈕或使用快速鍵（IE下為Ctrl+F5，Firefox為Ctrl+Shift+R）。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
