CSS псевдокласс :is()
Всем привет! Недавно узнал о том что в CSS есть псевдокласс :is(), который позволяет значительно сократить длинные записи селекторов. По сути он просто принимает список селекторов для выбора элементов HTML.
Несколько примеров:button:is(:hover, :focus) { background: green;}
Меняет фон для кнопки если она имеет состояние focus или hover.
:is(thead, tfoot) tr :is(th, td) { background: red;}
Выбирает все элементы th и td внутри хедера и футера таблицы.
:is(ul, ol, menu) > :is(ul, ol, menu) { background: yellow;}
В данном примере мы выбираем все списки которые уже находятся в списках.
Собственно вот такая довольно полезная штуковина. Поддерживается на данный момент всеми основными браузерами, вот ссылка на caniuse. Удачи в экспериментах!