CSS 選擇器7 屬性

2021-09-20 08:24:08 字數 1048 閱讀 5640

css選擇器-系列文章

選擇器例子

例子描述

css[attribute]

[target]

選擇帶有 target 屬性所有元素。

2[attribute=value]

[target=_blank]

選擇 target="_blank" 的所有元素。

2[attribute~=value]

[title~=flower]

選擇 title 屬性包含單詞 "flower" 的所有元素。注意是以單詞為單位的,不能匹配單詞的一半2

[attribute1=value]

[lang1=en]

選擇 lang 屬性值以 "en" 開頭的所有元素。豎線等號注意是以單詞為單位的後面緊跟連線符2

選擇其 src 屬性值以 "https" 開頭的每個 a 元素。

3[attribute$=value]

a[src$=".pdf"]

選擇其 src 屬性以 ".pdf" 結尾的所有 a元素。

3[attribute*=value]

a[src*="abc"]

選擇其 src 屬性中包含 "abc" 子串的每個 a 元素。

3

helloworld

hello world

hello-world

testinfo

test info

test-info

執行效果:

image.png

div1

div2

div3

div4

mydiv

divp

執行效果

image.png

css選擇器-系列文章

css-選擇器8-a與input常用偽類

7 CSS屬性選擇器

可以為擁有指定屬性的 html 元素設定樣式,而不僅限於 class 和 id 屬性。注釋 只有在規定了 doctype 時,ie7 和 ie8 才支援屬性選擇器。在 ie6 及更低的版本中,不支援屬性選擇。下面的例子為帶有 title 屬性的所有元素設定樣式 title 下面的例子為 title ...

CSS選擇器 屬性選擇器

最近重新學習了css3,發現選擇器還能這麼玩。介紹一下屬性選擇器 我給咱們順著往下縷一縷 資訊量挺大 剛開始是這樣子 如下 doctype html head meta charset utf 8 title 測試網頁 title style h1 m1 style head body div h1...

CSS屬性選擇器

簡單屬性選擇器,如 css h1 class html 那麼以上h1標籤裡的內容字型顏色都會改變。同時我們也可以通過這種方法來給自己建立的標籤加上樣式,如 css planet moon html venus earth mars 這樣的話,第二條和第三條就會被加上樣式。還可以根據標籤裡的具體屬性值...