CSS :isселекторы
Полное справочное руководство по селекторам CSS
Определение и использование
CSS:isПсевдокласс — это обобщённый селектор, который позволяет объединять несколько селекторов вместе, чтобы их можно было повторно использовать в правилах CSS.
:isПсевдокласс может принимать любое количество селекторов в качестве аргументов и возвращает объединение элементов, соответствующих этим селекторам.
1. Объединение селекторов типа элементов
:is(h1, h2, h3) {
color: red;
}Этот код установит красный цвет текста для всех элементов h1, h2 и h3.
2. Объединение селекторов классов
:is(.highlight, .warning) {
font-weight: bold;
}Этот код сделает шрифт полужирным для всех элементов, у которых есть класс highlight или warning.
3. Объединение разных типов селекторов
:is(a[href^="https"], button[disabled]) {
cursor: pointer;
}Этот код установит курсор в виде указателя для всех ссылок, начинающихся с https, и для кнопок в отключённом состоянии.
Примечание
:isПсевдоклассы могут повысить читаемость и удобство сопровождения CSS-кода, особенно когда нужно применить одни и те же стили к нескольким типам элементов.:isПсевдоклассы не создают новых элементов и не изменяют структуру документа; они всего лишь селекторы, используемые для сопоставления элементов.
Поддержка браузеров
Числа в таблице указывают номер первой версии браузера, поддерживающей это свойство.
| Селекторы | |||||
|---|---|---|---|---|---|
| :invalid | 10.0 | 10.0 | 4.0 | 5.0 | 10.0 |
Синтаксис CSS
:is(selector1, selector2, ..., selectorN) {
/* 样式规则 */
}
selector1, selector2, ..., selectorNЭто последовательность селекторов, которые могут быть типами элементов, селекторами классов, селекторами атрибутов, псевдоклассами и т. д.
Другие расширения