Head First HTML與CSS
第十章 div與span
CSS——掌控頁面的表現(xiàn)
<a>元素的不同狀態(tài)
鏈接的樣式表現(xiàn)與其他元素稍有不同雁刷，取決于具體環(huán)境，它們會瞬間改變樣式挑豌。
未訪問的鏈接安券，稱為“鏈接”，默認(rèn)為藍(lán)色氓英。訪問過的鏈接侯勉，稱為“已訪問的鏈接”，使用不同的顏色顯示铝阐，默認(rèn)為紫色址貌。把鼠標(biāo)放在一個鏈接上行疏，但不點擊方庭，稱為“懸停”税灌。在一些瀏覽器上吹害，鼠標(biāo)懸停在鏈接上時你會看到一個工具提示螟凭，它會顯示“title”屬性的文本，如果看得更仔細(xì)一點它呀，你會發(fā)現(xiàn)懸停在鏈接上時螺男，它會有一種不同的樣式。
因此纵穿，<a>元素的樣式會根據(jù)它的狀態(tài)(未訪問下隧，已訪問，懸停等)而改變谓媒。
如何根據(jù)元素的狀態(tài)指定樣式淆院？
如下：
a:link{
color:green;
}
a:visited{
color:red;
}
a:hover{
color:yellow;
}
第一個選擇器應(yīng)用于未訪問的鏈接，第二個選擇器應(yīng)用于已訪問的鏈接句惯，第三個選擇器應(yīng)用于懸停狀態(tài)的鏈接土辩。
如果把<a>元素當(dāng)成一個普通元素來指定樣式支救，如：
a{color:red;}
那么鏈接會在任何狀態(tài)下保持同種樣式，無法做到用戶友好拷淘。
還有另外兩種狀態(tài)：focus和active搂妻。
focus：瀏覽器將焦點放在鏈接上時為焦點（focus）狀態(tài)（Tab鍵輪流訪問頁面上所有鏈接，瀏覽器訪問到某個鏈接時辕棚，這個鏈接就擁有“焦點”）。
active：用戶第一次單擊一個鏈接時邓厕，就處于活動（active）狀態(tài)逝嚎。
偽類
上述:link,:visited,:hover其實就是偽類選擇器，類是指創(chuàng)建一個分組详恼，放入一些元素补君，可以對他們一起指定樣式；而偽類就像一個類昧互，但不是真正的類挽铁，你可以對偽類指定樣式，但是并沒在HTML中輸入這些偽類敞掘。
瀏覽器會自主檢查每個<a>元素的狀態(tài)叽掘，把它添加到正確的偽類中。例如玖雁，如果一個鏈接已經(jīng)訪問過更扁，它會被放在“:visited”偽類中。因此赫冬，這些類確實是存在浓镜，瀏覽器在后臺向這些類中增加和刪除元素。
偽類不僅僅能處理鏈接劲厌，還能處理其他元素膛薛。例如偽類:first-child對應(yīng)元素的第一個子元素，:last-child對應(yīng)元素的最后一個子元素补鼻。如<blockquote>中的第一個和最后一個段落哄啄。
層疊
HTML的CSS樣式表來源有三種：作者編寫的樣式表，用戶創(chuàng)建的樣式表辽幌，瀏覽器本身的默認(rèn)樣式表增淹。瀏覽器確定要對一個元素應(yīng)用哪個樣式時，會使用所有這些樣式表乌企，按優(yōu)先級排序為：作者虑润、用戶、瀏覽器的樣式表加酵。
給定一組樣式表中的一組樣式拳喻，瀏覽器以層疊的方式確定一個元素究竟應(yīng)用哪個樣式哭当。假設(shè)頁面上有一個<h1>元素，我們想知道這個元素的font-size屬性冗澈。步驟如下：
1.收集所有樣式表
包括Web頁面作者的樣式表钦勘、用戶增加的樣式表和瀏覽器的默認(rèn)樣式。
2.找到所有匹配的聲明
例如亚亲，我們要找font-size屬性彻采，所以要查看所有可能選擇<h1>元素的選擇器的font-size聲明。檢查所有樣式表捌归，找出所有匹配<h1>且有font-size屬性的規(guī)則肛响。
3.現(xiàn)在對所有匹配的規(guī)則排序
既然得到了所有的規(guī)則，現(xiàn)在按作者惜索、讀者特笋、瀏覽器的順序排序。
4.按特定性大小對三種來源的聲明分別排序
特定性大的優(yōu)先巾兆。簡單來說猎物，如果一個規(guī)則能更準(zhǔn)確地選擇一個元素，那么這個規(guī)則更特定角塑。例如“blockquote h1”比"h1"更特定蔫磨。具體特定性判斷方法之后介紹。
5.對于沖突的規(guī)則（來源相同吉拳、特定性相同）质帅，按照它們在各自樣式表里出現(xiàn)的順序進(jìn)行排序
后面的優(yōu)先，覆蓋前面的留攒。
這樣得到的有序列表中的第一個規(guī)則就是我們應(yīng)用到這個元素的樣式規(guī)則煤惩。
6.如果在層疊的所有規(guī)則中，沒有找到匹配的屬性炼邀，就要使用繼承魄揉。對于能繼承的屬性，瀏覽器會查看這個元素的祖先拭宁，從父元素開始洛退，嘗試找到這個屬性的值。如果找到了杰标，就會應(yīng)用兵怯。
7.如果這個屬性不能繼承或祖先也沒有指定該屬性，就會應(yīng)用瀏覽器的默認(rèn)樣式腔剂。
特定性具體判斷方法
從三位的特定數(shù)計算開始媒区。
初始都是：0 0 0
如果該選擇器包含id，每個id在百位上加1。
如果該選擇器包含類或偽類袜漩，每個類或偽類在十位上加1绪爸。
如果該選擇器包含元素名，每個元素名在個位上加1宙攻。
例如：
h1 001
h1.blue 011
ol li p 003
em 001
.green 010
span.cd 011
a:link 011
#elixirs h1 101
#sidebar 100
綜合考慮id奠货、類和元素后，得到的特定數(shù)越大座掘，其特定性越強递惋。
類似“h1,h2”規(guī)則，可以拆開來看 都是001溢陪。
讀者樣式對作者樣式的覆蓋
讀者可能會覆蓋一個樣式丹墨，在他的屬性聲明最后放置一個“!important”，例如：
h1{
font-size:200%
!important;
}
這會覆蓋作者的樣式嬉愧。
