Как в css получить элемент по атрибуту и классу?

Question

[Илья Матвийчук]

<div class="bg" data-theme="light">aaaa</div>
<div class="text" data-theme="light">bbbb</div>

Как через css получить элемент с атрибутом data-theme=light И .bg?
Может можно как-то :not() использовать? типа

[data-theme='light']:not(:not(.bg)) {

}

Comments

[Михаил]

а может без :not

[Илья Матвийчук]

Михаил,

[data-theme='light'] .bg {

}

не работает

[Михаил]

Илья Матвийчук, не удивительно
Вы ищите .bg В [data]

[Илья Матвийчук]

Михаил, а как надо?

Answer 1

[Талян]

Синтаксис:
html_tag[attribute_name=attribute_value].classname

div[data-theme=light].bg {
  background-color: red;
}

если элементы не только DIV-ы, то соответственно

[data-theme=light].bg {
  background-color: red;
}

Comments

[Илья Матвийчук]

ааа, спасибо