将CSS应用于一组包含col-substring的css类

前端之家收集整理的这篇文章主要介绍了将CSS应用于一组包含col-substring的css类前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我不知道最好的方式来说这个,这可能是为什么我一直在努力研究它,即使它很简单。

我想做的是将CSS应用于一组类。

例如我有类.col-1,.col-2,.col-3,.col-4

我想要做的是使一些CSS可以说可能改变所有类的边框颜色与文本col-我不必将其应用于每个单独的数字。

我相信我以前看过这个,但不能想像如何做到这一点。

解决方法

您可以使用[class * =“col-”] CSS attribute selector选择任何包含至少一个col-作为其类值的元素的元素。
[class*="col-"] {
    border-color: red;
}

如果类属性的所有值以col-开头,则可以使用[class ^ =“col-”]选择器。

但是,为了防止像foo-col-1这样的类被选中,您可以使用以下两个选择器的组合如下(感谢@JosephSpens):

[class^="col-"],[class*=" col-"] {
  border-color: red;
}

WORKING DEMO

原文链接:https://www.f2er.com/css/218239.html

猜你在找的CSS相关文章