:default
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
CSS псевдокласс :default
находит элемент формы, установленный по умолчанию для группы связанных элементов.
Этот селектор используется для элементов: <button>
, <input type="checkbox">
, <input type="radio">
, и <option>
.
/* Выбрать установленный по умолчанию среди <input> */
input:default {
background-color: lime;
}
Сгруппированные элементы, поддерживающие множественный выбор, также могут иметь несколько элементов, выбранных по умолчанию. В этом случае псевдокласс :default
найдёт все эти элементы. Например, можно стилизовать чекбоксы по умолчанию в группе чекбоксов.
Синтаксис
:default
Пример
HTML
<input type="radio" name="season" id="spring" />
<label for="spring">Spring</label>
<input type="radio" name="season" id="summer" checked />
<label for="summer">Summer</label>
<input type="radio" name="season" id="fall" />
<label for="fall">Fall</label>
<input type="radio" name="season" id="winter" />
<label for="winter">Winter</label>
CSS
input:default {
box-shadow: 0 0 2px 1px coral;
}
input:default + label {
color: coral;
}
Результат
Спецификации
Specification |
---|
HTML Standard # selector-default |
Selectors Level 4 # default-pseudo |
Совместимость с браузерами
BCD tables only load in the browser