14. CSS3选择器 属性选择器

在 HTML 中，通过各种各样的属性可以给元素增加很多附加的信息。例如，通过 id 属性可以将不同 div 元素进行区分。

在 CSS2 中引入了一些属性选择器，而 CSS3 在 CSS2 的基础上对属性选择器进行了扩展，新增了 3 个属性选择器，使得属性选择器有了通配符的概念，这三个属性选择器与 CSS2 的属性选择器共同构成了 CSS 功能强大的属性选择器。如下表所示：

 实例展示

html 代码：

<a href="xxx.pdf">我链接的是 PDF 文件</a>
<a href="#" class="icon">我类名是 icon</a>
<a href="#" title="我的 title 是 more">我的 title 是 more</a>

css 代码：

a[class^=icon]{
  background: green;
  color:#fff;
}
a[href$=pdf]{
  background: orange;
  color: #fff;
}
a[title*=more]{
  background: blue;
  color: #fff;
}

效果如下：

以上关于14. CSS3选择器 属性选择器的文章就介绍到这了，更多相关内容请搜索码云笔记以前的文章或继续浏览下面的相关文章，希望大家以后多多支持码云笔记。