CSS3 :checked 伪类

定义和用法

CSS :checked 伪类用于匹配任何被选中的 <input> 或 <option> 元素。

这适用于 <input type="radio">、<input type="checkbox"> 以及 <select> 元素中的 <option>。

实例

例子 1

为所有被选中的 <input> 元素设置一个细的红色轮廓：

input:checked {
  outline: 1px solid red;
}

본인이 직접 시도해 보세요

例子 2

单选按钮、复选框和选项在被选中时设置不同的样式：

input[type="radio"]:checked {
  box-shadow: 0 0 5px 3px 파란색;
}
input[type="checkbox"]:checked {
  box-shadow: 0 0 5px 3px maroon;
}
option:checked {
  color: 파란색;
  background-color: 핑크;
}

본인이 직접 시도해 보세요

CSS 문법

:checked {
  css 선언;
}

기술 세부 사항

浏览器支持

표中的数字指定了完全支持该伪类的首个浏览器版本。