CSS3属性选择器是指可以通过HTML元素的属性选择器来选择指定元素的样式。下面是一些常用的CSS3属性选择器:
1.[attribute] 选择带有指定属性的元素,例如:
a[href] {
color: blue;
}
2.[attribute=value] 选择带有指定属性和值的元素,例如:
input[type="text"] {
width: 200px;
}
3.[attribute~=value] 选择属性值包含指定词汇的元素,例如:
p[class~="warning"] {
color: red;
}
4.[attribute|=value] 选择带有指定属性值的元素,其中属性值以指定值开头,后面可能有连字符,例如:
td[lang|="en"] {
color: blue;
}
5.[attribute^=value] 选择带有指定属性值开头的元素,例如:
a[href^="https"] {
color: green;
}
6.[attribute$=value] 选择带有指定属性值结尾的元素,例如:
a[href$=".pdf"] {
color: red;
}
7.[attribute*=value] 选择属性值包含指定字符串的元素,例如:
input[type*="date"] {
width: 150px;
}
使用这些属性选择器可以方便地选择具有特定属性或属性值的元素,从而为这些元素定义不同的样式。