css选择器之模糊匹配

1.

[class*=“icon”]{

…

}

说明：所有class包含"icon"字符串的元素都会被选中

[class*="icon"]{color:red;}

<div class="icon-test1">111111</div><div class="icon-test2">222222</div><div class="aaa icon-test3">333333</div><div class="eeeicon">444444</div>

2.

[class^=“icon”]{

…

}

说明：所有class以"icon"字符串开头的元素都会被选中

[class^="icon"]{color:red;}

<div class="icon-test1">111111</div><div class="icon-test2">222222</div><div class="aaa icon-test3">333333</div><div class="eeeicon">444444</div>

3.

[class$=“icon”]{

…

}

说明：所有class以"icon"结尾的元素都会被选中

[class$="icon"]{color:red;}

<div class="icon-test1">111111</div><div class="icon-test2">222222</div><div class="aaa icon-test3">333333</div><div class="eeeicon">444444</div>