diff options
Diffstat (limited to 'files/ru/web/html/element/input/range/index.html')
-rw-r--r-- | files/ru/web/html/element/input/range/index.html | 32 |
1 files changed, 16 insertions, 16 deletions
diff --git a/files/ru/web/html/element/input/range/index.html b/files/ru/web/html/element/input/range/index.html index fc14501602..e4f349c376 100644 --- a/files/ru/web/html/element/input/range/index.html +++ b/files/ru/web/html/element/input/range/index.html @@ -46,7 +46,7 @@ translation_of: Web/HTML/Element/input/range <p>Для этого поля нет доступного паттерна валидации, но следующая валидация реализованы следующие проверки</p> <ul> - <li>Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдет ошибка некорректного ввода.</li> + <li>Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдёт ошибка некорректного ввода.</li> <li>Значение не может быть меньше чем {{htmlattrxref("min", "input")}}. По умолчанию: 0.</li> <li> Значение не может быть больше чем {{htmlattrxref("max", "input")}}. По умолчанию: 100.</li> <li>Значение должно кратно {{htmlattrxref("step", "input")}}. По умолчанию: 1.</li> @@ -59,7 +59,7 @@ translation_of: Web/HTML/Element/input/range <pre class="brush: js notranslate">defaultValue = (rangeElem.max < rangeElem.min) ? rangeElem.min : rangeElem.min + (rangeElem.max - rangeElem.min)/2;</pre> -<p>Если предпринята попытка установить значение меньше минимального, то оно примет значение атрибута min. Аналогично, попытка установить значение больше максимального, приведет к установлению значения равного атрибуту max.</p> +<p>Если предпринята попытка установить значение меньше минимального, то оно примет значение атрибута min. Аналогично, попытка установить значение больше максимального, приведёт к установлению значения равного атрибуту max.</p> <h2 id="Дополнительные_атрибуты">Дополнительные атрибуты</h2> @@ -75,7 +75,7 @@ translation_of: Web/HTML/Element/input/range <tbody> <tr> <td><code>{{anch("list")}}</code></td> - <td>id элемента <datalist>, который содержит предопределенные значение (не обязательно)</td> + <td>id элемента <datalist>, который содержит предопределённые значение (не обязательно)</td> </tr> <tr> <td><code>{{anch("max")}}</code></td> @@ -94,7 +94,7 @@ translation_of: Web/HTML/Element/input/range <p id="htmlattrdeflist">{{page("/en-US/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}</p> -<p>Смотрите <a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Element/Input/range$edit#A_range_control_with_hash_marks">управление диапазоном с помощью решетки</a> ниже, для примера того, как параметры диапазона обозначаются в поддерживаемых браузерах.</p> +<p>Смотрите <a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Element/Input/range$edit#A_range_control_with_hash_marks">управление диапазоном с помощью решётки</a> ниже, для примера того, как параметры диапазона обозначаются в поддерживаемых браузерах.</p> <h3 id="htmlattrdefmax">{{htmlattrdef("max")}}</h3> @@ -102,7 +102,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="htmlattrdefmin">{{htmlattrdef("min")}}</h3> -<p>Наименьшее значение в диапазоне допустимых значений. Если {{htmlattrxref("value", "input")}}, введенный в элемент, меньше этого значения, то элемент не проходит <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">проверку ограничения</a>. Если значение атрибута <code>min</code> не является числом, то элемент не имеет максимального значения.</p> +<p>Наименьшее значение в диапазоне допустимых значений. Если {{htmlattrxref("value", "input")}}, введённый в элемент, меньше этого значения, то элемент не проходит <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">проверку ограничения</a>. Если значение атрибута <code>min</code> не является числом, то элемент не имеет максимального значения.</p> <p>Это значение должно быть меньше или равно значению атрибута <code>max</code>.</p> @@ -131,7 +131,7 @@ translation_of: Web/HTML/Element/input/range <dl> <dt>{{htmlattrdef("orient")}} {{non-standard_inline}}</dt> - <dd id="orient-include">Похоже на -moz-orient не стандартное CSS свойство влияющее на {{htmlelement('progress')}} и{{htmlelement('meter')}} элементы, <code>orient</code> атрибут определяем ориентацию слайдера. Значение <code>horizontal</code>, значит что слайдер будет отображен горизонтально, а <code>vertical</code>- что вертикально .</dd> + <dd id="orient-include">Похоже на -moz-orient не стандартное CSS свойство влияющее на {{htmlelement('progress')}} и{{htmlelement('meter')}} элементы, <code>orient</code> атрибут определяем ориентацию слайдера. Значение <code>horizontal</code>, значит что слайдер будет отображён горизонтально, а <code>vertical</code>- что вертикально .</dd> </dl> <div class="blockIndicator note"> @@ -140,7 +140,7 @@ translation_of: Web/HTML/Element/input/range <h2 id="Examples">Examples</h2> -<p>Пока тип <code>number</code> позволяет пользователям вводить число с дополнительными ограничениями, заставляя их значения находиться между максимальным и минимальным, он требует, чтобы они вводили определенное значение. Инпут с типом <code>range</code> позволяет вам запрашивать у пользователя значение в тех случаях, когда пользователь не может даже знать - каково выбранное конкретное числовое значение.</p> +<p>Пока тип <code>number</code> позволяет пользователям вводить число с дополнительными ограничениями, заставляя их значения находиться между максимальным и минимальным, он требует, чтобы они вводили определённое значение. Инпут с типом <code>range</code> позволяет вам запрашивать у пользователя значение в тех случаях, когда пользователь не может даже знать - каково выбранное конкретное числовое значение.</p> <p>Несколько примеров основный ситуаций, в которых инпуты с range используются:</p> @@ -155,7 +155,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="Указание_минимума_и_максимума">Указание минимума и максимума</h3> -<p>По умолчанию, минимум равен 0, а максимум равен 100. Если вас это не устраивает, вы можете с легкостью указать другие границы, изменив значения атрибутов {{htmlattrxref("min", "input")}} и/или {{htmlattrxref("max", "input")}}. Они могут быть принимать любые значения с плавающей точкой.</p> +<p>По умолчанию, минимум равен 0, а максимум равен 100. Если вас это не устраивает, вы можете с лёгкостью указать другие границы, изменив значения атрибутов {{htmlattrxref("min", "input")}} и/или {{htmlattrxref("max", "input")}}. Они могут быть принимать любые значения с плавающей точкой.</p> <p>Например, указать диапазон значений между -10 и 10, вы можете, используя:</p> @@ -185,11 +185,11 @@ translation_of: Web/HTML/Element/input/range <h3 id="Добавление_хэш-меток_и_лейблов">Добавление хэш-меток и лейблов</h3> -<p>Спецификация HTML дает браузерам некоторую гибкость при представлении диапазонных контроллеров. Нигде эта гибкость не проявляется больше, чем в области хэш-меток и, в меньшей степени, лейблов. Спецификация описывает как добавлять кастомные точки контроллера диапазона, используя атрибут {{htmlattrxref("list", "input")}} и элемент {{HTMLElement("datalist")}}, но не имеет требований или рекомендаций по стандартизации хэш-меток и лейблов по длине контроллера.</p> +<p>Спецификация HTML даёт браузерам некоторую гибкость при представлении диапазонных контроллеров. Нигде эта гибкость не проявляется больше, чем в области хэш-меток и, в меньшей степени, лейблов. Спецификация описывает как добавлять кастомные точки контроллера диапазона, используя атрибут {{htmlattrxref("list", "input")}} и элемент {{HTMLElement("datalist")}}, но не имеет требований или рекомендаций по стандартизации хэш-меток и лейблов по длине контроллера.</p> <h4 id="Макеты_контроллера_диапазона">Макеты контроллера диапазона</h4> -<p>Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определенные HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.</p> +<p>Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определённые HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.</p> <h5 id="Недекорированный_контроллер_диапазона">Недекорированный контроллер диапазона</h5> @@ -327,7 +327,7 @@ translation_of: Web/HTML/Element/input/range <div id="Orientation_sample3"> <h4 id="HTML_2">HTML</h4> -<p>В HTML нужно добавить обертку вокруг {{HTMLElement("input")}} - {{HTMLElement("div")}}, что позволит нам исправить макет после выполнения трансформации (т.к. трансформация автоматически не влияет на макет страницы):</p> +<p>В HTML нужно добавить обёртку вокруг {{HTMLElement("input")}} - {{HTMLElement("div")}}, что позволит нам исправить макет после выполнения трансформации (т.к. трансформация автоматически не влияет на макет страницы):</p> <pre class="brush: html notranslate"><div class="slider-wrapper"> <input type="range" min="0" max="11" value="7" step="1"> @@ -335,7 +335,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_2">CSS</h4> -<p>Теперь нам нужно немного CSS. Во-первых, это CSS для самой обертки; это указание дисплея и размеров для правильного расположения на странице; по сути, он резервирует область страницы для слайдера, так, чтобы можно было поместить повернутый слайдер в зарезервированном пространстве, не создавая беспорядка.</p> +<p>Теперь нам нужно немного CSS. Во-первых, это CSS для самой обёртки; это указание дисплея и размеров для правильного расположения на странице; по сути, он резервирует область страницы для слайдера, так, чтобы можно было поместить повёрнутый слайдер в зарезервированном пространстве, не создавая беспорядка.</p> <pre class="brush: css notranslate">.slider-wrapper { display: inline-block; @@ -372,7 +372,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_3">CSS</h4> -<p>Берем только те инпуты что имеют тип range:</p> +<p>Берём только те инпуты что имеют тип range:</p> <pre class="notranslate">input[type="range"] { -webkit-appearance: slider-vertical; @@ -406,7 +406,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_4">CSS</h4> -<p>Берем только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right:</p> +<p>Берём только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right:</p> <pre class="notranslate">input[type="range"] { writing-mode: bt-lr; @@ -416,7 +416,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="Все_вместе">Все вместе</h3> -<p>Каждый из вышеперечисленных примеров работает в своем браузере, мы попробуем объединить все вместе чтоб добиться кроссбраузерности решения:</p> +<p>Каждый из вышеперечисленных примеров работает в своём браузере, мы попробуем объединить все вместе чтоб добиться кроссбраузерности решения:</p> <h4 id="HTML_6">HTML</h4> @@ -427,7 +427,7 @@ translation_of: Web/HTML/Element/input/range <h4 id="CSS_5">CSS</h4> -<p>Берем только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right, для Edge и Internet Explorer, и добавляем <code>-webkit-appearance: slider-vertical</code> для всех -webkit-based браузеров:</p> +<p>Берём только те инпуты что имеют тип range, меняем writing mode с default на <code>bt-lr</code>, или bottom-to-top и left-to-right, для Edge и Internet Explorer, и добавляем <code>-webkit-appearance: slider-vertical</code> для всех -webkit-based браузеров:</p> <pre class="notranslate">input[type="range"] { writing-mode: bt-lr; |