# CSS 屬性選擇器 ## 對帶有指定屬性的 HTML 元素設置樣式。 可以為擁有指定屬性的 HTML 元素設置樣式，而不僅限于 class 和 id 屬性。 注釋：只有在規定了 !DOCTYPE 時，IE7 和 IE8 才支持屬性選擇器。在 IE6 及更低的版本中，不支持屬性選擇。 ## 屬性選擇器 下面的例子為帶有 title 屬性的所有元素設置樣式： ``` [title] { color:red; } ``` ## 屬性和值選擇器 下面的例子為 title="W3School" 的所有元素設置樣式： ``` [title=W3School] { border:5px solid blue; } ``` ## 屬性和值選擇器 - 多個值 下面的例子為包含指定值的 title 屬性的所有元素設置樣式。適用于由空格分隔的屬性值： ``` [title~=hello] { color:red; } ``` 下面的例子為帶有包含指定值的 lang 屬性的所有元素設置樣式。適用于由連字符分隔的屬性值： ``` [lang|=en] { color:red; } ``` ## 設置表單的樣式 屬性選擇器在為不帶有 class 或 id 的表單設置樣式時特別有用： ``` input[type="text"] { width:150px; display:block; margin-bottom:10px; background-color:yellow; font-family: Verdana, Arial; } input[type="button"] { width:120px; margin-left:35px; display:block; font-family: Verdana, Arial; } ``` ## CSS 選擇器參考手冊 | 選擇器 | 描述 | | --- | --- | | [[_attribute_]](/cssref/selector_attribute.asp "CSS [attribute] 選擇器") | 用于選取帶有指定屬性的元素。 | | [[_attribute_=_value_]](/cssref/selector_attribute_value.asp "CSS [attribute=value] 選擇器") | 用于選取帶有指定屬性和值的元素。 | | [[_attribute_~=_value_]](/cssref/selector_attribute_value_contain.asp "CSS [attribute~=value] 選擇器") | 用于選取屬性值中包含指定詞匯的元素。 | | [[_attribute_|=_value_]](/cssref/selector_attribute_value_start.asp "CSS [attribute|=value] 選擇器") | 用于選取帶有以指定值開頭的屬性值的元素，該值必須是整個單詞。 | | [[_attribute_^=_value_]](/cssref/selector_attr_begin.asp "CSS [attribute^=value] 選擇器") | 匹配屬性值以指定值開頭的每個元素。 | | [[_attribute_$=_value_]](/cssref/selector_attr_end.asp "CSS [attribute$=value] 選擇器") | 匹配屬性值以指定值結尾的每個元素。 | | [[_attribute_*=_value_]](/cssref/selector_attr_contain.asp "CSS [attribute*=value] 選擇器") | 匹配屬性值中包含指定值的每個元素。 | ## 相關內容 如果您需要更深入地學習關于屬性選擇器的知識，請閱讀 W3School 的高級教程：[CSS 屬性選擇器詳解](/css/css_selector_attribute.asp)。