1. 基本属性选择器：
- 属性存在选择器 [attribute]：选择具有指定属性的所有元素。
[target] {
color: blue;
}
- 属性值相等选择器 [attribute=value]：选择具有指定属性值的所有元素。
[target="_blank"] {
text-decoration: underline;
}
- 前缀匹配选择器 [attribute^=value]：选择具有以指定值开头的属性值的所有元素。
[href^="https://"] {
color: green;
}
- 后缀匹配选择器 [attribute$=value]：选择具有以指定值结尾的属性值的所有元素。
[src$=".png"] {
border: 1px solid red;
}
- 包含匹配选择器 [attribute*=value]：选择具有包含指定值的属性值的所有元素。
[title*="flower"] {
background-color: yellow;
}
2. 特定属性选择器：
- 类选择器 .class：选择具有指定类名的所有元素。
.highlight {
background-color: yellow;
}
- ID选择器 #id：选择具有指定ID的元素。
#header {
font-size: 24px;
}
这些属性选择器允许你更加灵活地选择文档中的元素，根据它们的属性值或其他属性来应用样式。需要注意的是，过度使用属性选择器可能会导致选择器的复杂性增加，应谨慎使用以避免性能问题。
转载请注明出处：http://www.zyzy.cn/article/detail/12549/CSS