web中如何根據(jù)具體屬性值選擇

小編給大家分享一下web中如何根據(jù)具體屬性值選擇，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

除了選擇擁有某些屬性的元素，還可以進(jìn)一步縮小選擇范圍，只選擇有特定屬性值的元素。

例子 1

例如，假設(shè)希望將指向 Web 服務(wù)器上某個(gè)指定文檔的超鏈接變成紅色，可以這樣寫(xiě)：

a[href="http://www.w3school.com.cn/about_us.asp"] {color: red;}

例子 2

與簡(jiǎn)單屬性選擇器類似，可以把多個(gè)屬性-值選擇器鏈接在一起來(lái)選擇一個(gè)文檔。

a[href="http://www.w3school.com.cn/"][title="W3School"] {color: red;}

這會(huì)把以下標(biāo)記中的第一個(gè)超鏈接的文本變?yōu)榧t色，但是第二個(gè)或第三個(gè)鏈接不受影響：

<a href="http://www.w3school.com.cn/" title="W3School">W3School</a>
<a href="http://www.w3school.com.cn/css/" title="CSS">CSS</a>
<a href="http://www.w3school.com.cn/html/" title="HTML">HTML</a>

例子 3

同樣地，XML 語(yǔ)言也可以利用這種方法來(lái)設(shè)置樣式。

下面我們?cè)倩氐叫行悄莻€(gè)例子中。假設(shè)只希望選擇 moons 屬性值為 1 的那些 planet 元素：

planet[moons="1"] {color: red;}

上面的代碼會(huì)把以下標(biāo)記中的第二個(gè)元素變成紅色，但第一個(gè)和第三個(gè)元素不受影響：

<planet>Venus</planet>
<planet moons="1">Earth</planet>
<planet moons="2">Mars</planet>

以上是“web中如何根據(jù)具體屬性值選擇”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！