3

いくつかの div をラップで表示したい。div は同じクラス名を持ち、固定幅です。行の最後の div ではなく、行の最初の div にいくつかの margin-right を設定したいのですが、問題はhtml を変更できないことです。CSS でできない場合、jQuery でできますか? 編集:申し訳ありませんが、言い忘れましたが、常に2つのdivが連続しています。

<div class="list">

<div class="box">Box 1</div> 
<div class="box">Box 2</div> <!-- should be margin-right:0 --> 
<div class="box">Box 3</div> 
<div class="box">Box 4</div> <!-- should be margin-right:0 --> 

</div>
4

4 に答える 4

7

今はこれに慣れています

最初のオプション

.box:nth-of-type(2n){
margin-right:0;
}

2番目のオプション

.box:nth-child(even){
margin-right:0;
}

詳細http://www.w3.org/Style/Examples/007/evenodd.en.html

于 2012-06-25T12:01:23.817 に答える
2

これには css3last-childプロパティを使用できます。次のように書きます。

.box:last-child{
 margin-right:0;
}

しかし、それはIE8以下ではありません

要件に応じて、これに + セレクターを使用できます。次のように書きます。

.box + .box{
 margin-left:10px;
}

&それはIE7まで動作します

于 2012-06-25T12:02:13.537 に答える
2
div:not(:last-child) { margin-right: 10px; }
于 2012-06-25T12:02:26.110 に答える
0

これが必要なようですhttp://csswizardry.com/2011/08/building-better-grid-systems/

于 2012-06-25T12:52:24.957 に答える