3

コンテナー (div) と、ネストされたインライン ブロックまたはフローティング div の束があるとします。
http://jsfiddle.net/D6PgE/

.container { width : 300px; }
.inner     { width : 100px; }

<div class="container">
    <div class="inner"> 1 </div>
    <div class="inner"> 2 </div>
    <div class="inner"> 3 </div>
    <div class="inner"> 4 </div>
    <div class="inner"> 5 </div>
    <div class="inner"> 6 </div>
    <div class="inner"> 7 </div>
    <div class="inner"> 8 </div>
    <div class="inner"> 9 </div>
</div>

ラップされた要素を選択する最良の方法は何ですか? ラップされた行のn 番目の要素 を選択することは可能ですか(フィドルでは奇数になります)。

私が考えることができる唯一のことは、JSを使用して要素のoffsetTop位置を比較することです。しかし、私は最近 CSS についていくことができず、CSS がますます強力になっていることを知っています。CSS ソリューションはありますか? -ありがとう


編集
「行」の n 番目の要素を選択しようとしています。問題は、これはテーブルではないため、行がないことです。また、幅が非常に大きい可能性があるため、私の例は単純であることも付け加えておく必要があります。そのため、1行あたりの要素数が増える可能性があります。したがって、次のようなものは機能しnth-childません

4

2 に答える 2

4

いいえ、要素がどのようにレイアウトされているか、またはそれらのスタイルがどのように計算されているかに基づいてセレクターが選択できないため、未知の/動的なサイズで機能する CSS ソリューションはありません。

そのような情報を取得して操作するには、JS を使用する必要があります。

于 2012-08-08T14:07:18.510 に答える
-1

シンプルな CSS3 ソリューションは、 nth-child セレクターを使用することです。いくつかの例http://jsfiddle.net/D6PgE/6/でフィドルを更新しました。

詳細については、http ://www.w3schools.com/cssref/sel_nth-child.asp を参照してください。

于 2012-08-08T14:12:56.123 に答える