選擇器練習
屬性選擇器
選擇class屬性值以Hello開頭的元素
被選擇會被變成黑色字體
- class="Hello 你好"
- class="Hi 你好"
- class="我不會法語哈哈"
選擇class屬性值「以END結尾」的元素
被選擇會被變成黑色字體
- class="END_1"
- class="1_END"
- class="E+N+D"
選擇class屬性值「包含Cnt」的元素
- class="CNTxx"
- class="xxCnT"
- class="xxCntxx"
虛擬類別
以梅花座排順序(男女交叉)
男生藍色,女生紅色
排頭綠色
排尾黑色
- 男 (first)
- 女
- 男
- 女
- 男
- 女
- 男(last)
以相同元素為對象的虛擬類別
第一個元素以金色框線框住
偶數個元素以粉色框線框住
唯一一個元素則以黃色顯示
heading1 (h4)
paragraph1
heading2 (h4)
paragraph2
heading3 (h5)
paragraph3
雙色條紋表格
| White | White |
| Pink | Pink |
| White | White |
| Pink | Pink |
哪一個學號符合格式
符合格式的以黑色顯示
- id1
- B111230225
- id2
- B11123064
- id3
- B99923088
其它虛擬類別
否定選擇器
選擇最後一列以外的部份
除最後一列以外以紅色框線框住
- list1
- list2
- list3
- list4
- list5
目標選擇器
動物種類
- 肉食性動物
- 老虎 鱷魚 獅子 狼 北極熊 老鷹 鴨嘴獸泰瑞 多數貓頭鷹 食人魚
- 草食性動物
- 馬 兔類 羊 牛 陸龜 象 樹懶 長頸鹿 無尾熊
- 雜食性動物
- 台灣黑熊 人類 白鼻心 金剛猩猩 小水鴨 黑猩猩 野豬
UI類別選擇器
依表單狀態切換Label的樣式
已選擇的選項會變成黑色
選項3為淡色代表無法選擇