在HTML中，通過(guò)各種各樣的屬性可以給元素增加很多附加的信息。例如，通過(guò)id屬性可以將不同div元素進(jìn)行區(qū)分。
在CSS2中引入了一些屬性選擇器，而CSS3在CSS2的基礎(chǔ)上對(duì)屬性選擇器進(jìn)行了擴(kuò)展，新增了3個(gè)屬性選擇器，使得屬性選擇器有了通配符的概念，這三個(gè)屬性選擇器與CSS2的屬性選擇器共同構(gòu)成了CSS功能強(qiáng)大的屬性選擇器。如下表所示：
(單擊可放大)
實(shí)例展示：
html代碼：
<a href="xxx.pdf">我鏈接的是PDF文件</a> <a href="#" class="icon">我類名是icon</a> <a href="#" title="我的title是more">我的title是more</a>
css代碼
a[class^=icon]{ background: green; color:#fff; } a[href$=pdf]{ background: orange; color: #fff; } a[title*=more]{ background: blue; color: #fff; }
結(jié)果顯示：
請(qǐng)你在右邊輸入css3代碼改變?nèi)墟溄拥谋尘邦伾?，第一行為紅色，第二行為綠色，第三行為藍(lán)色。
實(shí)現(xiàn)效果：
要求：用三條css樣式實(shí)現(xiàn)。（大腦開動(dòng)起來(lái)吧?。?/p>
好吧！如果實(shí)現(xiàn)想不出來(lái)就打開“不會(huì)了怎么辦”吧。
對(duì)CSS3新增的屬性選擇器要深入掌握呀！請(qǐng)你再詳細(xì)看下內(nèi)容有關(guān)的詳細(xì)講解吧，相信這對(duì)你很輕松的！
參考代碼如下：
a[class^="column"]{background:red;}
a[href$="doc"]{background:green;}
a[title*="box"]{background:blue;}
請(qǐng)驗(yàn)證，完成請(qǐng)求
由于請(qǐng)求次數(shù)過(guò)多，請(qǐng)先驗(yàn)證，完成再次請(qǐng)求
打開微信掃碼自動(dòng)綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報(bào)