|
|
首先先看一下基本定義：
復(fù)合選擇器就是兩個(gè)或多個(gè)基本選擇器，通過(guò)不同方式連接而成的選擇器，主要包括“交集”選擇器、“并集”選擇器、“后代”選擇器。
交集選擇器
“交集”復(fù)合選擇器是由兩個(gè)選擇器直接連接構(gòu)成，其結(jié)果是選中二者各自元素范圍的交集。其中第一個(gè)必須是標(biāo)記選擇器，第二個(gè)必須是類別選擇器或者ID選擇器。這兩個(gè)選擇器之間不能有空格，必須連續(xù)書寫。
注意其中第一個(gè)必須是標(biāo)記選擇器，如p.class1，但有時(shí)候會(huì)看到.class1.class2，即2個(gè)都是類選擇器，在其他瀏覽器中是允許出現(xiàn)這種情況的，但I(xiàn)E6不兼容。如下表：
兩個(gè)類選擇器的“交集”復(fù)合選擇器瀏覽器支持表：
| Mac: Safari 4.0 | 支持 |
|---|---|
| Mac: Chrome 5.0 | 支持 |
| Mac: FireFox 3.6 | 支持 |
| Mac: Opera 10 | 支持 |
| Win: FireFox 3.6 | 支持 |
| Win: Opera 10 | 支持 |
| Win: IE6 | 不支持 |
| Win: IE7 | 支持 |
| Win: IE8 | 支持 |
復(fù)合選擇器的使用
這是個(gè)簡(jiǎn)單的tab菜單：
如下是html代碼:
<li class="first"><a href="">節(jié)目</a></li>
<li class="current"><a href="">合集</a></li>
<li><a href="">草稿</a></li>
<li class="last"><a href="">項(xiàng)目</a></li>
</ul>
it知識(shí)庫(kù)：使用CSS的類名交集復(fù)合選擇器，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
