CSS 选择器名称中的星号/通配符

Question

我发誓我看到了一个高级 CSS 规则，它在选择器名称中使用星号。我正在使用 Bootstrap，并且父 div 中有几个不同的 div，如下所示：

<div class="example">
    <div class="col-sm-1">
        TEST
    </div>
    <div class="col-sm-4">
        TEST
    </div>
</div>

我想用类似的东西：

div.example div.col-sm-*{
    padding-right:5px;
}

我知道并排添加每条规则不会杀死我，但我想我以前见过类似的事情，并且想学习未来的速记法（如果存在）。我也尝试过类似的事情：

div.example div.col-sm-[*]{
    padding-right:5px;
}

这可能吗？

Answer 1

您可能正在考虑属性选择器：

div.example div[class*="col-sm-"]{
    padding-right:5px;
}

假设每个

div

唯一拥有的类是列类，那么就可以了。或者使用

^=

代替

*=

来指示

class

属性值 以该字符串开始。

Answer 2

0
投票

您还可以使用：

.example div{
//rule
}