Question

我想要定位Bootstrap容器中的所有列，以便我可以给出类似的样式。例如：

<div class="container unique">
  <div class="row">
    <div class="col-md-3"></div>
    <div class="col-md-3"></div>
    <div class="col-md-3"></div>
    <div class="col-md-3"></div>
  </div>
</div>

我可以用CSS定位：

.unique .col-md-3{...}

但我想要做的是当我有许多不同的col-*元素时，将它们全部聚集在一起。

我试过了：

.unique .col-*{...}

但它没有用。我可以用CSS做到这一点吗？

Answer 1

佩德罗，你正在寻找的是attribute selector。在您的特定情况下，您可以像这样使用它：

.unique [class~=col] {color:red }

但您也可以使用更广泛的选项，例如

[class*=' col-']

覆盖前面的空白区域。

此外，您还有same documentation in Spanish

Answer 2

CSS属性包含选择器可用于实现此目的：

.unique [class*=col]{...}

MDN是CSS选择器的有用参考站点。作为参考，找到属性选择器here。

Bootstrap CSS类通配符

2 个答案: