|
首先先看一下基本定義:
復合選擇器就是兩個或多個基本選擇器,通過不同方式連接而成的選擇器,主要包括“交集”選擇器、“并集”選擇器、“后代”選擇器。
交集選擇器
“交集”復合選擇器是由兩個選擇器直接連接構成,其結果是選中二者各自元素范圍的交集。其中第一個必須是標記選擇器,第二個必須是類別選擇器或者ID選擇器。這兩個選擇器之間不能有空格,必須連續書寫。
注意其中第一個必須是標記選擇器,如p.class1,但有時候會看到.class1.class2,即2個都是類選擇器,在其他瀏覽器中是允許出現這種情況的,但IE6不兼容。如下表:
兩個類選擇器的“交集”復合選擇器瀏覽器支持表:
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 | 支持 |
復合選擇器的使用
這是個簡單的tab菜單:
如下是html代碼:
<li class="first"><a href="">節目</a></li>
<li class="current"><a href="">合集</a></li>
<li><a href="">草稿</a></li>
<li class="last"><a href="">項目</a></li>
</ul>
it知識庫:使用CSS的類名交集復合選擇器,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。