網頁誕生初期，沒有描述樣式的語言，創建了很多用於描述樣式的標簽。但這些標簽破壞了html作為一門結構語言的表現。 於是，W3C在1995年開始起草CSS，提出將結構和樣式分離的解決方案。 元素 元素是文檔結構的基礎，在CSS中，每個元素都會生成一個框(或者說盒) 表現形式 替換元素：替換元素的內容並 ...
網頁誕生初期，沒有描述樣式的語言，創建了很多用於描述樣式的標簽。但這些標簽破壞了html作為一門結構語言的表現。
於是，W3C在1995年開始起草CSS，提出將結構和樣式分離的解決方案。
元素
元素是文檔結構的基礎，在CSS中，每個元素都會生成一個框(或者說盒)
表現形式
替換元素：替換元素的內容並非有瀏覽器直接生成，典型的莫
過於img元素了；
非替換元素：大部分html元素都是非替換元素，如div元素、p元素等
塊級元素：填充父元素的內容區
行內元素：在文本行內生成元素框
聲明CSS
[1] 外部樣式表
永久樣式表(persistent style sheet)
如果指定rel屬性為stylesheet，沒有指定title屬性，那麼它
將成為一個永久樣式表
<link rel="stylesheet" href="/style.css">
候選樣式表(alternate style sheet)
如果為link標簽指定一個title屬性，那麼它將成為一個
候選樣式表
<link href="/style1.css" title="mystyle1">
首選樣式表(preferred style sheet)
在link標簽已經指定rel為stylesheet的情況下，再指定
title屬性，那麼它將成為一個首選樣式表
<link href="stylesheet" href="/style1.css" title="mystyle1">
```
其他屬性：
media:
all //所有媒體
screen //屏幕媒體
handheld //手持設備
aural //語音合成器
tv //電視
tty //固定間距環境
print //列印設備
embossed //Braille列印設備
braille //Braille設備
projection //投影設備
```
[2] 文檔樣式表
在文檔中使用style標簽包含樣式表,成為文檔樣式表
(document style sheet)或內嵌樣式表(embedded style sheet)
<style>
div {
color: #f60;
}
</style>
在style標簽內可以使用@import載入外部樣式表
@import url(style2.css) screen;
@import與link標簽相比較：
聲明必須放在所有樣式前面
無法指定候選樣式表，所有聲明的樣式都會被載入
[3] 內聯樣式
使用style屬性為單個元素設置屬性，inline在這裡翻譯為內聯
，而不是行內，意為內部自帶
<p style="color:#f60">天若有情</p>
註意：不推薦使用，一個內聯樣式只能放一個聲明快，不能放整個樣式表
，因此不能使用諸如@import之類的規則，style屬性的值只能是出現
在大括弧之間的部分。
