From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/ru/web/css/_colon_indeterminate/index.html | 130 +++++++++++++++++++++++ 1 file changed, 130 insertions(+) create mode 100644 files/ru/web/css/_colon_indeterminate/index.html (limited to 'files/ru/web/css/_colon_indeterminate') diff --git a/files/ru/web/css/_colon_indeterminate/index.html b/files/ru/web/css/_colon_indeterminate/index.html new file mode 100644 index 0000000000..d131eb3888 --- /dev/null +++ b/files/ru/web/css/_colon_indeterminate/index.html @@ -0,0 +1,130 @@ +--- +title: ':indeterminate' +slug: 'Web/CSS/:indeterminate' +tags: + - CSS + - Псевдо-класс + - Разметка +translation_of: 'Web/CSS/:indeterminate' +--- +

{{CSSRef}}

+ +

CSS псевдо-класс :indeterminate находит элементы в неопределённом состоянии.

+ +
/* Выбирает все элементы <input>, которые находятся в неопределенном состоянии */
+input:indeterminate {
+  background: lime;
+}
+ +

Селектор находит следующие элементы:

+ + + +

Синтаксис

+ +
{{csssyntax}}
+ +

Примеры

+ +

Чекбокс и радио переключатели

+ +

В этом примере специальные стили применяются к меткам, которые привязаны к неопределенным полям формы.

+ +

HTML

+ +
<div>
+  <input type="checkbox" id="checkbox">
+  <label for="checkbox">Эта метка будет зелёной.</label>
+</div>
+<div>
+  <input type="radio" id="radio">
+  <label for="radio">Эта метка будет зелёной.</label>
+</div>
+ +

CSS

+ +
input:indeterminate + label {
+  background: lime;
+}
+
+ +

JavaScript

+ +
var inputs = document.getElementsByTagName("input");
+
+for (var i = 0; i < inputs.length; i++) {
+  inputs[i].indeterminate = true;
+}
+
+ +

{{EmbedLiveSample('Checkbox_radio_button', 'auto', 50)}}

+ +

Полоса прогресса

+ +

HTML

+ +
<progress>
+
+ +

CSS

+ +
progress {
+  margin: 4px;
+}
+
+progress:indeterminate {
+  opacity: 0.5;
+  background-color: lightgray;
+  box-shadow: 0 0 2px 1px red;
+}
+
+ +

Результат

+ +

{{EmbedLiveSample('Progress_bar', 'auto', 30)}}

+ +

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

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
СпецификацияСтатусКомментарий
{{SpecName('HTML WHATWG', '#selector-indeterminate', ':indeterminate')}}{{Spec2('HTML WHATWG')}}Нет изменений.
{{SpecName('HTML5 W3C', '#selector-indeterminate', ':indeterminate')}}{{Spec2('HTML5 W3C')}}Определение семантики HTML и проверки.
{{SpecName('CSS4 Selectors', '#indeterminate', ':indeterminate')}}{{Spec2('CSS4 Selectors')}}Нет изменений.
{{SpecName('CSS3 Basic UI', '#indeterminate', ':indeterminate')}}{{Spec2('CSS3 Basic UI')}}Определён псевдо-класс, но не семантика.
+ +

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

+ +
+ + +

{{Compat("css.selectors.indeterminate")}}

+
-- cgit v1.2.3-54-g00ecf