Ответ 1
Смотрите: http://jsfiddle.net/uDvEt/1/
.options > div:not(:first-child) select { background:yellow;}
При следующей разметке я хочу, чтобы селектор 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;}
Вам нужно выбрать опцию div
вместо select
при использовании :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
Другой альтернативой является общий комбинатор sibling ~
(который поддерживается IE7 +):
div.options > div ~ div > select