溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

CSS中屬性選擇器有哪些

發(fā)布時間：2021-08-03 10:28:11 來源：億速云 閱讀：125 作者：小新 欄目：web開發(fā)

這篇文章主要為大家展示了“CSS中屬性選擇器有哪些”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“CSS中屬性選擇器有哪些”這篇文章吧。

對帶有指定屬性的 HTML 元素設置樣式。

可以為擁有指定屬性的 HTML 元素設置樣式，而不僅限于 class 和 id 屬性。

注釋：只有在規(guī)定了 !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]

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

[attribute=value]

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

[attribute~=value]

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

[attribute|=value]

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

[attribute^=value]

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

[attribute$=value]

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

[attribute*=value]

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

以上是“CSS中屬性選擇器有哪些”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業(yè)資訊頻道！

向AI問一下細節(jié)

免責聲明：本站發(fā)布的內容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。

css
AI
助
手