Сомневаюсь в селекторе CSS> [#id (.class1 или .class2)]

Question

Я думаю, что должен существовать лучший способ сделать это ...

Я использую следующий селектор CSS

#book_form .ano_chegada, #book_form .ano_partida {...}

Html:

<form id="book_form">
<input class='ano_chegada' .../>
<input class='ano_partida' .../>
</form>

Я действительно не люблю повторять идентификатор формы дважды.Это строго необходимо?Я знаю, что он должен работать без второго идентификатора (#book_form), но он выберет все элементы, которые имеют один и тот же класс (.ano_partida), верно?

Спасибо =) (Obrigado, на португальском языке)

Приветствия из Португалии

Answer 1

Только один поставщик браузеров реализовал эту функцию 4 месяца назад в браузере, который все еще находится в бета-версии. Смотри http://hacks.mozilla.org/2010/05/moz-any-selector-grouping/

Answer 2

Вы можете немного изменить свой HTML, чтобы сделать использование CSS-селекторов проще.(Это не обязательно того стоит, и может увеличить размер вашего вывода.)

Добавить другое имя класса в теги класса:

<form id="book_form"> 
<input class='ano_chegada something' .../> 
<input class='ano_partida something' .../> 
</form>

#book_form .something {...}

Или разбить то, что есть, на несколько классов:

<form id="book_form"> 
<input class='ano chegada' .../> 
<input class='ano partida' .../> 
</form>

#book_form .ano {...}

Answer 3

Да, это строго необходимо, если вы хотите выбирать только элементы с теми классами, которые находятся внутри #book_form.

Сам по себе CSS не имеет вложенных селекторов, однако некоторые решения на стороне сервера могут обеспечитьвас с расширениями CSS, которые предоставляют вам такую ​​функциональность.