CSS特性选择器

最新推荐文章于 2025-03-26 19:45:46 发布

小木子子耳

最新推荐文章于 2025-03-26 19:45:46 发布

阅读量736

点赞数 1

CC 4.0 BY-SA版权

分类专栏： CSS基础知识文章标签： css

本文链接：https://blog.youkuaiyun.com/liyyyyyyyyyyyyyy/article/details/73201613

CSS基础知识专栏收录该内容

6 篇文章

订阅专栏

                    
                        
                    
                    选择器含义示例
简单选择器[ ]
匹配一种特定的特性（与特性值无关）p[class]
应用于所有包含class特性的元素
精确选择器[=]
匹配一种特定的特性，该特性具有特定的值p[class=”dog”]
应用于所有包含class特性值为dog的元素
部分选择器[~=]
匹配一种特定的特性，该特性值出现在以空格隔开的单词列表中p[class~=”dog”]
应用于特定的< p >元素，这些元素的class特性值是以空格隔开的单词列表，而其中一项是dog
开头选择器[^=]
匹配一种特定的特性，该特性的值以某个特定的字符串作为开头p[attr^”d”]
应用于特定的< p >元素，这些元素的某个特性的值以字母”d”开头
包含选择器[*=]
匹配一种特定的特性，该特性的值包含一个特定的子字符串p[attr*”do”]
应用于特定的< p >元素，这些元素的某个特性之中含有”do”
结尾选择器[ $= ]
匹配一种特定的特性，该特性的值以某个特定的字符串作为结尾p[attr$”g”]
应用于特定的< p >元素，这些元素的某个特性的值以字母“g”结尾

                

选择器	含义	示例
简单选择器	[ ] 匹配一种特定的特性（与特性值无关）	p[class] 应用于所有包含class特性的元素
精确选择器	[=] 匹配一种特定的特性，该特性具有特定的值	p[class=”dog”] 应用于所有包含class特性值为dog的元素
部分选择器	[~=] 匹配一种特定的特性，该特性值出现在以空格隔开的单词列表中	p[class~=”dog”] 应用于特定的< p >元素，这些元素的class特性值是以空格隔开的单词列表，而其中一项是dog
开头选择器	[^=] 匹配一种特定的特性，该特性的值以某个特定的字符串作为开头	p[attr^”d”] 应用于特定的< p >元素，这些元素的某个特性的值以字母”d”开头
包含选择器	[*=] 匹配一种特定的特性，该特性的值包含一个特定的子字符串	p[attr*”do”] 应用于特定的< p >元素，这些元素的某个特性之中含有”do”
结尾选择器	[ $= ] 匹配一种特定的特性，该特性的值以某个特定的字符串作为结尾	p[attr$”g”] 应用于特定的< p >元素，这些元素的某个特性的值以字母“g”结尾