CSS中的[x * =“y”]和[x ^ =“y”]是什么意思？

Question

我想知道在css中创建一个类是什么意思*和^？

例如：

[class*="sample-"]

和

[class^="sample-"]

Answer 1

*=表示找到 text＆＃34;示例 - ＆＃34;的所有元素存在于类属性中的某个位置。例如：

<style>
    [class*="sample-"] {}
</style>

<p class="asdsadsample-adas">Matches</p>
<p class="smple-">Doesn't match</p>

^=这意味着找到 class属性以文本＆＃34;示例 - ＆＃34; 开头的所有元素。例如

<style>
    [class^="sample-"] {}
</style>

<p class="sample-blah">Matches</p>
<p class="ssample-blah">Doesn't match</p>