css - 使用响应实用程序类时更改 "span"类 - Twitter Bootstrap

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

所以，我要做的就是在我使用 '响应实用程序类' .visible-tablet.

最初，我以为它会奇迹般地自动更改为“最大宽度”，但不幸的是它没有。

Answer 1

正如@scumah 所指出的，您不会使用 CSS 更改类。为此，您将使用 JS。

但是，如果您想要更改一个类(在本例中为 span3)的特征，当它包含在具有给定类的元素中时(此处为 visible-tablet >) 这只是让您的 CSS 选择器工作的问题:

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

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

JSFiddle

但是，所有这些看起来都有些老套，因此您可能需要重新考虑您想要完成的本质。