屬性選擇器
阿新 • • 發佈：2021-06-30
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>屬性選擇器</title> <style type="text/css"> /* 為所有具有title屬性p元素設定背景顏色黃色 屬性選擇器 - 根據元素中的屬性或屬性值選取指定元素 語法 [屬性名] 選取含有指定屬性的元素 [屬性名="屬性值"] 選取含有指定屬性值的元素 [屬性名^="屬性值"] 選取屬性值以指定內容開頭的元素 [屬性名$="屬性值"] 選取屬性值以指定內容結尾的元素 [屬性名*="屬性值"] 選取屬性值以包含指定內容的元素*/ /* p[title]{ background-color: yellow; } */ /* 為title屬性值以ab揩油的元素設定顏色為黃 p[title^="ab"]{ background-color: yellow; } */ </style> </head> <body> <!-- title屬性，這個屬性可以給任何標籤指定 滑鼠移入到元素上時，元素中title屬性值作為提示文字顯示 --> <p title="hello">我是一個段落</p> <p>我是一個段落</p> <p>我是一個段落</p> <p>我是一個段落</p> <p>我是一個段落</p><p title="abc">我是一個段落</p> </body> </html>
屬性選擇器根據元素中的屬性或屬性值選取指定元素
語法
[屬性名] 選取含有指定屬性的元素
[屬性名=“屬性值”] 選取含有指定屬性值的元素
[屬性名^="屬性值"] 選取屬性值以指定內容開頭的元素
[屬性名$="屬性值"] 選取屬性值以指定內容結尾的元素
[屬性名*="屬性值"] 選取屬性值以包含指定內容的元素