CSS學習筆記(六)CSS 屬性選擇器

2021-06-14 03:26:10 字數 956 閱讀 2307

可以為擁有指定屬性的 html 元素設定樣式,而不僅限於 class 和 id 屬性。

注釋:internet explorer 7 (以及更高版本)在規定了 !doctype 的情況下支援屬性選擇器。ie6 及更低的版本不支援屬性選擇器。

下面的例子為帶有 title 屬性的所有元素設定樣式:

[title]
親自試一試

下面的例子為 title="w3school" 的所有元素設定樣式:

[title=w3school]

下面的例子為包含指定值的 title 屬性的所有元素設定樣式。適用於由空格分隔的屬性值:

[title~=hello]
下面的例子為帶有包含指定值的 lang 屬性的所有元素設定樣式。適用於由連字元分隔的屬性值:

[lang|=en]

屬性選擇器在為不帶有 class 或 id 的表單設定樣式時特別有用:

input[type="text"]

input[type="button"]

選擇器描述[attribute]

用於選取帶有指定屬性的元素。

[attribute=value]

用於選取帶有指定屬性和值的元素。

[attribute~=value]

用於選取屬性值中包含指定詞彙的元素。

[attribute|=value]

用於選取帶有以指定值開頭的屬性值的元素,該值必須是整個單詞。

[attribute^=value]

匹配屬性值以指定值開頭的每個元素。

[attribute$=value]

匹配屬性值以指定值結尾的每個元素。

[attribute*=value]

匹配屬性值中包含指定值的每個元素。

css屬性學習筆記

1 交集選擇器 p.p1 是p標籤並且class是p1 2 後代選擇器 div p 在div下面的p標籤 3 並集選擇器 新增多個標籤,中間用逗號隔開。標籤可共用後面屬性的效果。多個樣式表作用於同一標籤上,如果這些樣式都不一樣的話,那麼標籤的 最終樣式就是所有層疊樣式的總和。如果有相同樣式宣告,按優...

Css屬性 學習筆記

文字屬性 box 字型屬性 p 引用外部字型書寫格式 font face box 邊框屬性 box 乙個值 控制四個角,css3 兩個值 1 分隔符為空格 第乙個值左上角和右下角圓弧半徑 第二個值左下角和右上角圓弧半徑.2 分割線為正斜線,第乙個值四個角的水平半徑,第二個值四個角的垂直半徑 橢圓形。...

css 筆記 css 屬性

以下內容大部分來自 文字字型 匹配原則 泛型字型 文字大小 n 取值 文字效果 文字粗細 說明 設定英文大小寫轉換屬性 字型屬性 字型顏色 返回目錄 水平對齊方式 垂直對齊 文字效果 首行縮排 文字轉換 單詞之間間隔 字元之間間距 壓縮空白屬性 行距 設定標註文字水平對齊方式 設定標註文字顯示的位置...