對具有指定屬性的 HTML 元素設定樣式。可以為擁有指定屬性的 HTML 元素設定樣式，而不僅限於 class 和 id 屬性。本文主要為大家介紹了css屬性選擇器的相關知識，有興趣的朋友一起看看吧，希望能幫助大家。
註解：只有在規定了 !DOCTYPE 時，IE7 和 IE8 才支援屬性選擇器。在 IE6 及更低的版本中，不支援屬性選擇。
屬性選擇器
下面的範例為所有帶有title 屬性的元素設定樣式：
[title]
{
color:red;
}屬性和值選擇器
下面的範例為title="W3School" 的所有元素設定樣式：
##
[title=W3School]
{
border:5px solid blue;
}[title~=hello] { color:red; }[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;
}
選擇器 |
描述說明 |
##[attribute] |
#用於選取指定屬性的元素。 |
[attribute=value] |
##用於選取帶有指定屬性和值的元素。 |
[attribute~=value] |
##用於選取屬性值中包含指定詞彙的元素。
|
[attribute|=value] |
用於選取帶有以指定值開頭的屬性值的元素，該值必須是整個單字。 |
[attribute^=value] |
匹配屬性值以指定值開頭的每個元素。 |
[attribute$=value] |
##符合屬性值以指定值結尾的每個元素。 |
[attribute*=value] |
##符合屬性值中包含指定值的每個元素。
|
以上是詳解CSS 屬性選擇器的詳細內容。更多資訊請關注PHP中文網其他相關文章！
