<!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>
属性选择器根据元素中的属性或属性值选取指定元素
语法
[属性名] 选取含有指定属性的元素
[属性名=“属性值”] 选取含有指定属性值的元素
[属性名^="属性值"] 选取属性值以指定内容开头的元素
[属性名$="属性值"] 选取属性值以指定内容结尾的元素
[属性名*="属性值"] 选取属性值以包含指定内容的元素