CSS :default Pseudo-class

Definition and Usage

CSS :default The pseudo-class is used to select the default form element from a group of related elements.

This pseudo-class can be used for <button>, <input type="checkbox">, <input type="radio">, and <option> elements.

Example

Example 1

Add red shadow to the default input elements:

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

Try It Yourself

Example 2

Set different default styles for radio buttons, checkboxes, and options:

input[type=radio]:default {
  box-shadow: 0 0 5px 3px blue;
}
input[type=checkbox]:default {
  box-shadow: 0 0 5px 3px maroon;
}
option:default {
  color: blue;
  background-color: pink;
}

Try It Yourself

CSS Syntax

:default {
  css declarations;
}

Technical Details

Browser Support

The numbers in the table specify the first browser version that fully supports this pseudo-class.