3

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.

最初は、奇跡的に自動的に「最大幅」に変わると思っていましたが、残念ながらそうではありませんでした。

4

1 に答える 1

1

@scumah が指摘したように、CSS を使用してクラスを変更するつもりはありません。そのためには、JS を使用します。

span3ただし、特定のクラス (ここでは ) を持つ要素に含まれているクラス (この場合は ) の特性を変更したい場合はvisible-tablet、CSS セレクターを機能させるだけの問題です。

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

これspan3により、 がデフォルトの a の幅と同じになるように変更されますspan6。

JSFiddle

ただし、これはすべてハックのように見えるため、本質的に何を達成しようとしているのかを再考することをお勧めします。

于 2012-07-22T19:23:43.000 に答える