11、CSS选择器：属性、类、ID及伪元素选择器详解

CSS选择器：属性、类、ID及伪元素选择器详解

1. 属性选择器

1.1 以特定后缀匹配属性值

在CSS中，可以使用美元符号（$）来表示选择器匹配属性值的结尾。例如，以下规则会将所有以 .html 后缀结尾的链接文本颜色改为 indianred ：

a[href$='.html'] {
    color: indianred;
}

示例代码如下：

<a href='http://www.somesite.com/index.html'>Hello, World!</a>

此链接的 href 属性以 .html 结尾，因此文本颜色会变为 indianred 。而对于以下链接：

<a href='http://www.somesite.com/index.php'>A .php page</a>

其 href 属性以 .php 结尾，不会应用上述颜色规则。

1.2 包含特定字符串的属性值选择器

使用星号（*）可以选择属性值中包含特定字符串的元素。例如：