CSS: Стиль применяется к сочетанию классов?

Question

Я не уверен, что это возможно, но есть ли синтаксис для использования в CSS, если вы хотите стилизовать элемент на основе комбинации применяемых к нему классов?

Я понимаю, что я могу проверить элемент с помощью jQuery или что-то подобное и изменить его стиль на основе классов, которые у него есть, но есть ли для этого простой способ CSS?

Например, если у меня есть класс для смелой и зеленый:

.bold_green { color:green; font-weight:bold; } 

А класс для смелой и синий:

.bold_blue { color:blue; font-weight:bold. } 

Теперь предположим, что я использую JQuery для добавления и удаления классы динамически и хотите, чтобы любой элемент, который имеет оба класса, стал курсивом.

Что-то вроде:

.bold_green AND .bold_blue { color:pink; font-style:italic; } 

Или, если я хочу, чтобы стиль элемента, который имеет aclass, и является потомком другого элемента, который имеет другой класс?

Что-то вроде:

.bold_green HAS_CHILD .bold_blue { color:black; background-color:yellow; } 

Спасибо!

Редактировать

Спасибо за все ответы. Это в значительной степени то, что я думал (просто рассматривая классы как обычные селекторы), но они, похоже, не работают для меня. Я должен проверить свой код и убедитесь, что они не переопределены как-то ...

Answer 1

$('.bold_green.bold_blue').addClass('something-else'); 

Или в CSS:

.bold_green.bold_blue { color: pink; } 

Обратите внимание, что нет никакого пространства между селекторами.

Answer 2

Вам не нужно ничего особенного, просто

.bold_green.bold_blue { color:pink; font-style:italic; } 

Answer 3

Paul и Voyager правильны для случая нескольких классов.

Для случая «ИМЕЕТ РЕБЕНОК» вы будете использовать:

.bold_green .bold_blue { ... } /* note the ' ' (called the descendant selector) */ 

Какой будет стиль любых bold_blue элементов внутри bold_green элемента.

Или, если вы хотите прямого потомка:

.bold_green > .bold_blue { ... } /* this child selector does not work in IE6 */ 

Какой будет стиль только bold_blue элементы, которые имеют непосредственный родитель bold_green.

Answer 4

В Visual Studio 2013 установка CSS применяется к нескольким классам с помощью "Comma" следующим образом:

.bold_green, .bold_blue { color:pink; font-style:italic; }