คำถามตัวเลือก CSS3 สำหรับทุกคนยกเว้นก่อนเลือก

ด้วยมาร์กอัปต่อไปนี้ฉันต้องการให้ตัวเลือก 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>

ฉันใช้สิ่งนี้ภายใน Prototype ซึ่งมีการสนับสนุนตัวเลือก css3 เกือบเต็มดังนั้นจึงไม่เกี่ยวข้องกับการรองรับเบราว์เซอร์

ตัวเลือกเริ่มต้นจะเป็นดังนี้:

div.options div select

ฉันได้ลองใช้รูปแบบต่างๆสองสามรูปแบบnth-childแล้ว:not(:first-child)แต่ดูเหมือนจะใช้งานไม่ได้

ดู: http://jsfiddle.net/uDvEt/1/

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

คุณต้องเลือกตัวเลือกdivs แทนselects เมื่อใช้:not(:first-child)เนื่องจากทุกตัวselectเป็นลูกคนแรก (และคนเดียว) ของแม่div:

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

อีกทางเลือกหนึ่ง:not(:first-child)คือใช้:nth-child()กับค่าชดเชยเริ่มต้นของ 2 เช่นนี้:

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

อีกทางเลือกหนึ่งคือ Combinator พี่น้องทั่วไป~(ซึ่งรองรับโดย IE7 +):

div.options > div ~ div > select

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