: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> .

css

/* Выбрать установленный по умолчанию среди <input> */
input:default {
  background-color: lime;
}

Сгруппированные элементы, поддерживающие множественный выбор, также могут иметь несколько элементов, выбранных по умолчанию. В этом случае псевдокласс :default найдёт все эти элементы. Например, можно стилизовать чекбоксы по умолчанию в группе чекбоксов.

Синтаксис

:default

Пример

HTML

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

css

input:default {
  box-shadow: 0 0 2px 1px coral;
}

input:default + label {
  color: coral;
}

Результат

Спецификации

Specification
HTML # selector-default
Selectors Level 4 # default-pseudo

Совместимость с браузерами

BCD tables only load in the browser