css - Bootstrap 中的冗余列类

Question

我在 Bootstrap 中做了很多这样的事情:

<div class="col-sm-4 col-md-4 col-lg-4">...

是否有任何简写 CSS 类表示“对所有视口(viewport)尺寸使用此列尺寸？”也许像下面这样的东西？

<div class="col-all-4">...

Answer 1

修改 col-* 类名的 media queries 围绕 min-width 工作并且没有限制为 max-width 值如下:

@media (min-width: 992px) {
  //For md
}

xs 元素的默认值。因此，为了避免冗余的 col 名称，您可以做的就是调用具有该列数的最小设备:

<div class="col-sm-4 col-md-4 col-lg-4">...

必须是

<div class="col-sm-4">...