Вложенные селекторы - возможно?

Question

Предположим, у меня есть div с кучей вещей внутри:

<div id="Product">
 <ul id="List"></ul>
 <div class="Component"></div>
 <input type=... />
 ...
</div>

Теперь я хочу стилизовать различные вещи, но только когда внутри #Product div.Как правило, я бы сделал:

#Product #List {}
#Product .Component {}
#Product input {}

Но можно ли сделать что-то подобное вместо этого?

#Product {
    #List {}
    .Component {}
    input {}
}

Answer 1

Вложение селекторов CSS невозможно со стандартным CSS, но есть и другие инструменты, такие как SASS , LESS и XCSS , которые позволяют вам писать правила вкак вы описываете.

Эти инструменты обычно "компилируются" в настоящий CSS, который обрабатывает преобразование вложенного синтаксиса селектора в реальные правила CSS.

Answer 2

Да, но не в обычном CSS. Вы можете использовать Sass! http://sass -lang.com /

Answer 3

Нет, вы не можете вложить правила в CSS еще. Доступны CSS препроцессоры, которые позволяют использовать такие интересные функции, как вложение, переменные и т. Д.

Выезд МЕНЬШЕ .