css3 选择器 CSS3 [attribute*=value] 选择器

css3 选择器

CSS3 选择器是 CSS3 中新增的一种选择器，它可以帮助我们更加精确地定位 HTML 元素，从而让我们能够更好地定义样式。CSS3 选择器可以分为三大类：属性选择器、伪类选择器、伪元素选择器。

首先，CSS3 属性选择器是用来匹配 HTML 元素的特定属性的，它可以帮助我们快速找到想要的元素。例如，[title] 选择器可以用来匹配所有 title 属性不为空的元素；[title="hello"] 选择器可以用来匹配 title 属性为 hello 的元素。

[title] { 
    color: red; 
} 
[title="hello"] { 
    color: blue; 
} 

其次，CSS3 伪类选择器是用来匹配特定的 HTML 状态的，例如 :hover、:focus 等。这些伪类选择器可以帮助我们轻松地定义当用户与 HTML 元素交互时应该显示的样式。例如，当用户将鼠标悬浮在一个超链接上时，就可以使用 :hover 选择器来修改该超链接的样式。

a:hover { 
    color: red; 
} 

最后，CSS3 伪元素选择器是用来匹配特定部分内容的，例如 ::first-letter、::first-line 等。这些伪元素选择器可以帮助我们对文本内容进行样式上的修饰。例如 ::first-letter 选择噲可以用来修饰文本中的首字母样式。

p::first-letter { 
    font-size: 2em;      font-weight: bold;      color: #ff0000;    } 

总之，CSS3 选择器是 CSS3 新出的一大特性，能够帮助我们快速准备地找到想要的 HTML 元素并对其进行样式上的修饰。使用 CSS3 选择噝能够大大减少代码量并提升效率。

CSS3 [attribute*=value] 选择器

div[class*="test"]
{
background:#ffff00;
}

[class*="test"]
{
background:#ffff00;
}