Beauty CSS(4)-選擇器part2

選擇器學不好,要飯要到老(誤)我認為學好CSS選擇器對於網站效率有很大幫助,當然這點我也還在學習當中。
今天繼續紀錄CSS的選擇器,文章若有謬誤還請不吝指正m(_ _)m。

Adjacent sibling selectors-同層相鄰選擇器
所謂的相鄰就是鄰居啦~要住在右手邊的隔壁才會有作用,用加號把鄰居放一起吧。

隔壁的隔壁不算唷

General sibling selector-同層兄弟選擇器
跟上者不同,這個選擇器是讓同一個樓層的住戶全部都套用,就像是同層公寓的門吧!不過英文意思是兄弟呢…如果直譯應該說是多胞胎?寫法是中間用條毛毛蟲連在一起~

Attribute selectors-屬性選擇器分成以下幾種
1. 標籤內有屬性(attribute)的會一起套用(屬性不一定是title,例如alt也可以):

2. 屬性(attribute)以及值(value)兼具的時候套用:

3. 屬性(attribute)內含部份值(value)的字元都可以套用,在屬性後面加條毛毛蟲跟著走~:

4. 屬性(attribute)的起始值(value)完全符合才會套用,將屬性後面隔一道牆吧|:

以上是今天的分享,明日預計是child系列!若有誤請指正,謝謝。
本文同步發表於http://ithelp.ithome.com.tw/question/10138109

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。