CSS: работа с not ()

Question

У меня есть CSS, который выглядит так:

a:focus { background-color: #eeeeee; }

Теперь в CSS3 есть атрибут not (). Как я могу работать с этим, когда я хочу добавить focus-background-color для всех элементов но с одним исключением: я хочу, чтобы это не добавлялось к тегам / элементам внутри .audio_wrapper

Answer 1

Попробуйте с там правилами:

a:focus { background-color: #eeeeee; }
.audio_wrapper a:focus {background-color: #000000}; <!-- or white or what is your default color-->

Answer 2

Псевдокласс: not не поможет вам в этой ситуации, поскольку он принимает только простых селекторов , а ваше условие зависит от атрибута родителя a. Лучшее решение - просто определить правило, а затем переопределить его вторым правилом для условного случая.

Редактировать: Во-вторых, вы могли бы сделать это так:

:not(.audio_wrapper) a:focus { ...rules... }

Answer 3

Селектор не поддерживается только современными браузерами (Firefox, Safari и Opera), а не IE.

a: not (.audio_wrapper) {background-color: #eeeeee; ............}