class^=是什么意思啊，在css中

Question

class^=是什么意思啊，在css中 

Answer 1

这是css属性选择器的一种：[attribute^=value] ，用来匹配属性值以指定值开头的每个元素。例如：

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

表示设置 class 属性值以 "test" 开头的所有元素的背景色，也就是说对class="test", class="test1" class="test-001"的元素都是有效的。

除此之外，还有一些常用的css属性选择器如下：

• [attribute~=value] 选取属性值中包含指定词汇的元素

• [attribute|=value]  选取带有以指定值开头的属性值的元素，该值必须是整个单词。

• [attribute$=value] 匹配属性值以指定值结尾的每个元素

• [attribute*=value] 匹配属性值中包含指定值的每个元素

Answer 2

举个例子：
设置 class 属性值以 "test" 开头的所有 div 元素的背景色：
div[class^="test"]
{
background:#ffff00;
}