最初の選択以外のすべてに対するCSS3セレクターの質問

Question 1

次のマークアップでは、CSSセレクターで各オプションdiv内の最初の選択メニュー以外のすべてを選択する必要があります。

<div class="options">
    <div class="opt1">
        <select title="Please choose Warranty">
            <option value="">Select Waranty</option>
            <option value="1">1 year guarantee</option>
            <option value="2">3 year guarantee</option>
        </select>
    </div>
    <div class="opt2">
        <select title="Please choose Color">
            <option value="">Select Color</option>
            <option value="1">Red</option>
            <option value="2">Blue</option>
        </select>
    </div>
    <div class="opt3">
        <select title="Please choose Size">
            <option value="">Select Size</option>
            <option value="1">Small</option>
            <option value="2">Big</option>
        </select>
    </div>
</div>

私はこれをほぼ完全なcss3セレクターサポートを備えたプロトタイプ内で使用しているため、ブラウザーサポートは関係ありません。

最初のセレクターは次のようになります。

div.options div select

私は上のいくつかのバリエーションを試してみたnth-childし、:not(:first-child)それを動作させるように見えることはできません。

Question 2

参照：http : //jsfiddle.net/uDvEt/1/

.options > div:not(:first-child) select { background:yellow;}

Question 3

あなたは、オプションを選択する必要があるdivの代わりのselect使用時にSを:not(:first-child)、すべてがあるため、selectその親の最初の（そして唯一の）子ですdiv。

div.options > div:not(:first-child) > select

の代わりに、次のように開始オフセット2 :not(:first-child)を使用:nth-child()します。

div.options > div:nth-child(n + 2) > select

別の代替方法は、一般的な兄弟コンビ~ネーター（IE7 +でサポートされています）を使用する方法です。

div.options > div ~ div > select

Question 4

.options > div:nth-child(n+2) select