This page was translated from English by the community.Learn more and join the MDN Web Docs community.
:indeterminate
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since июль 2015 г..
CSSпсевдокласс:indeterminate находит элементы в неопределённом состоянии.
css
/* Выбирает все элементы <input>, которые находятся в неопределённом состоянии */input:indeterminate { background: lime;}Селектор находит следующие элементы:
- Элементы
<input type="checkbox">, свойствоindeterminateкоторых было установлено вtrueчерезJavaScript - Элементы
<input type="radio">, когда все радио переключатели в одной группе (с одинаковым атрибутомname) не выбраны - Элементы
<progress>в неопределённом состоянии
Синтаксис
Error: could not find syntax for this itemПримеры
Чекбокс и радио переключатели
В этом примере специальные стили применяются к меткам, которые привязаны к неопределённым полям формы.
HTML
html
<div> <input type="checkbox" /> <label for="checkbox">Эта метка будет зелёной.</label></div><div> <input type="radio" /> <label for="radio">Эта метка будет зелёной.</label></div>CSS
css
input:indeterminate + label { background: lime;}JavaScript
js
var inputs = document.getElementsByTagName("input");for (var i = 0; i < inputs.length; i++) { inputs[i].indeterminate = true;}Полоса прогресса
HTML
html
<progress></progress>CSS
css
progress { margin: 4px;}progress:indeterminate { opacity: 0.5; background-color: lightgray; box-shadow: 0 0 2px 1px red;}Результат
Спецификации
| Specification |
|---|
| HTML # selector-indeterminate |
| Selectors Level 4 # indeterminate-pseudo |