css中属性选择器有哪些？
1、[attribute]：用于选取带有指定属性的元素。
1）、用于选取带有指定属性的元素
/**选择了.demo下所有带有id属性的a元素 **/
.demo a[id] {
}2）、也可以使用多属性进行选择元素。
/**选择了.demo下同时拥有href和title属性的a元素 **/
.demo a[href][title] {
}2、[attribute=value]：用于选取带有指定属性和值的元素。
当前也可以多个属性一起使用：
/**选择了.demo下id="first"的a元素 **/
.demo a[id="first"] {
}
/**选择了.demo下id="first"，且拥有title属性的a元素 **/
.demo a[id="first"][title] {
}注意：[attribute=value] 这种属性选择器，属性和属性值必须完全匹配，特别是对于属性值是词列表的形式时。
/** 匹配不到元素 **/
a[class="links"] {
}
/** 这个才能匹配到 **/
a[class="links item"] {
}
<a href="" class="links item">hangge.com</a>3、[attribute~=value]：用于选取属性值中包含指定词汇的元素。
同上面的完全匹配不同，这个只要属性值中有 value 就相匹配。
/** 可以匹配到元素 **/
a[class~="links"] {
}
<a href="" class="links item">hangge.com</a>4、[attribute|=value]：用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
这个选择器会选择 attr 属性值等于 value 或以 value- 开头的所有元素。
/** 下面3个img都会被匹配到 **/
img[src|="figure"] {
}
<img src="figure-0.png-600" alt="图1">
<img src="figure-1.png-600" alt="图1">
<img src="figure-2.png-600" alt="图1">5、[attribute^=value]：匹配属性值以指定值开头的每个元素。
/** href属性值以"mailto:"开头的所有a元素 **/
a[href^="mailto:"] {
}6、[attribute$=value]：匹配属性值以指定值结尾的每个元素。
/** href属性值以"png"结尾的所有a元素 **/
a[href$="png"] {
}7、[attribute*=value]：匹配属性值中包含指定值的每个元素。
/** title属性值中只要包含有"site"的所有a元素 **/
a[title*="site"] {
}以上就是css中属性选择器有哪些？的详细内容，更多请关注0133技术站其它相关文章！
