Question

我正在使用Twitter Bootstrap，但我在特定元素上遇到了一点困难。

以下是界面已提供的“脚手架”标记，我将以此为例。

<div class="row">
  <div class="span6">
    Level 1 column
    <div class="row">
      <div class="span3">Level 2</div>
      <div class="span3">Level 2</div>
    </div>
  </div>
</div>

另外，为了帮助解决这个问题...有“响应式实用程序类”，您可以在这里查看 - http://twitter.github.com/bootstrap/scaffolding.html#responsive

所以，我要做的只是在使用'响应实用程序类'class="span3"时将class="span6"更改为.visible-tablet.

最初，我认为它会奇迹般地自动变为'max-width'，但遗憾的是它没有。

Answer 1

正如@scumah指出的那样，你不会使用CSS更改类。为此你可以使用JS。

但是，如果要更改类的特征（在这种情况下为span3），当它包含在具有给定类（此处为visible-tablet）的元素中时，这只是获取的问题你的CSS选择器工作：

.visible-tablet .span3 {
  width: 352px;
}

这会将span3更改为与默认情况下span6的宽度相同。

JSFiddle

然而，所有这些看起来都有些苛刻，所以你可能想重新考虑一下你想要实现的目标。

使用响应式实用程序类时更改“span”类 - Twitter Bootstrap

1 个答案:

JSFiddle