CSS псевдокласс :checkedcss3

CSS селекторы

Значение и применение

CSS псевдокласс :checked применяется к элементам <input> (выбранные элементы type = "radio" и type = "checkbox"), а также к выбранному элементу <option>.

Поддержка браузерами

СелекторChrome
Chrome
Firefox
Firefox
Opera
Opera
Safari
Safari
Internet Explorer
IExplorer
Microsoft Edge
Edge
:checkedcss34.03.59.63.29.012.0

CSS синтаксис:

:checked {
блок объявлений;
}

Версия CSS

CSS3

Пример использования

odin
dva

odin
dva

<!DOCTYPE html>
<html>
<head>
<title> Псевдоклассы и псевдоэлементы</title>
<style type = "text/css"> 
input:checked {
width: 25px; 
height: 25px;
}
option:checked {
background-color: green; 
font-size: 24px;
}
</style>
</head>
<body>
<form>
<input type = "radio" checked = "checked" value = "odin" name = "test"> odin<br>
<input  type = "radio" value = "dva"name = "test">dva<br><br>
<input type = "checkbox"checked = "checked"value = "odin1">odin<br>
<input  type = "checkbox"value = "dva2">dva
</form><br>
<select>
<option value = "1">odin</option>
<option value = "2">dva</option>
<option value = "3">tri</option>
</select>
</body>
</html>
Использование псевдокласса :checked.
Использование псевдокласса :checked.
CSS селекторы