diff options
Diffstat (limited to 'files/ru/web/html/element/input')
7 files changed, 29 insertions, 29 deletions
diff --git a/files/ru/web/html/element/input/date/index.html b/files/ru/web/html/element/input/date/index.html index 5fb53a1437..c69a1eba71 100644 --- a/files/ru/web/html/element/input/date/index.html +++ b/files/ru/web/html/element/input/date/index.html @@ -123,7 +123,7 @@ console.log(dateControl.valueAsNumber); // prints 1496275200000, a JavaScript ti <h2 id="Использование_полей_ввода_c_типом_date">Использование полей ввода c типом date</h2> -<p>На первый взгляд, элемент <code><input type="date"></code> выглядит заманчиво — он предоставляет легкий графический интерфейс для выбора даты, нормализует формат даты, отправляемой на сервер независимо от локальных настроек пользователя. Тем не менее, есть проблемы с <code><input type="date"></code> в связи с ограниченой поддержкой браузеров.</p> +<p>На первый взгляд, элемент <code><input type="date"></code> выглядит заманчиво — он предоставляет легкий графический интерфейс для выбора даты, нормализует формат даты, отправляемой на сервер независимо от локальных настроек пользователя. Тем не менее, есть проблемы с <code><input type="date"></code> в связи с ограниченной поддержкой браузеров.</p> <p>В этом разделе мы посмотрим на простые, а затем и более сложные способы использования <code><input type="date"></code>, и позже дадим советы по уменьшению влияния поддержки браузерами (смотрите {{anch("Handling browser support")}}).</p> @@ -160,7 +160,7 @@ console.log(dateControl.valueAsNumber); // prints 1496275200000, a JavaScript ti <p>В результате выполнения кода, пользователь сможет выбрать любой день апреля 2017 года, но не сможет выбрать и даже просмотреть дни других месяцев и годов, в том числе через виджет <em>date picker</em>.</p> <div class="note"> -<p><strong>Примечание</strong>: Вы <em>должны</em> уметь использовать аттрибут {{htmlattrxref("step", "input")}}, чтобы менять количество дней, на которое будет происходить шаг при изменении даты (например, чтобы сделать выбираемыми только субботы). Однако, не похоже, что это где-то применялось на данный момент.</p> +<p><strong>Примечание</strong>: Вы <em>должны</em> уметь использовать атрибут {{htmlattrxref("step", "input")}}, чтобы менять количество дней, на которое будет происходить шаг при изменении даты (например, чтобы сделать выбираемыми только субботы). Однако, не похоже, что это где-то применялось на данный момент.</p> </div> <h3 id="Controlling_input_size">Controlling input size</h3> diff --git a/files/ru/web/html/element/input/datetime-local/index.html b/files/ru/web/html/element/input/datetime-local/index.html index 99ddddd6bd..63ad6800fc 100644 --- a/files/ru/web/html/element/input/datetime-local/index.html +++ b/files/ru/web/html/element/input/datetime-local/index.html @@ -89,7 +89,7 @@ dateControl.value = '2017-06-01T08:30';</pre> <h3 id="Установка_максимума_и_минимума_даты_и_времени">Установка максимума и минимума даты и времени</h3> -<p>Вы можете использовать {{htmlattrxref("min", "input")}} и {{htmlattrxref("max", "input")}} аттрибуты чтобы ограничить дату/время, которое может выбрать пользователь. В примере ниже мы устанавливает минимальные дату и время в <code>2017-06-01T08:30</code> и максимальные в <code>2017-06-30T16:30</code>:</p> +<p>Вы можете использовать {{htmlattrxref("min", "input")}} и {{htmlattrxref("max", "input")}} атрибуты чтобы ограничить дату/время, которое может выбрать пользователь. В примере ниже мы устанавливает минимальные дату и время в <code>2017-06-01T08:30</code> и максимальные в <code>2017-06-30T16:30</code>:</p> <pre class="brush: html"> <form> <label for="party">Enter a date and time for your party booking:</label> @@ -101,12 +101,12 @@ dateControl.value = '2017-06-01T08:30';</pre> <p>Как результат:</p> <ul> - <li>Могут быть выбраны только дни из Июня 2017 — только дни, которые входят в заданный диапазон дат доступны для выбота, и в виджете нельзя увидеть даты, не принадлежaщие Июню.</li> - <li>В зависимости от того, какой браузер Вы используете, Вы можете заметить, что вребя вне заданного диапазона не доступно к выбору (e.g. Edge), или доступно к выбору(e.g. Chrome) но невалидно (see {{anch("Validation")}}).</li> + <li>Могут быть выбраны только дни из Июня 2017 — только дни, которые входят в заданный диапазон дат доступны для выбора, и в виджете нельзя увидеть даты, не принадлежащие Июню.</li> + <li>В зависимости от того, какой браузер Вы используете, Вы можете заметить, что время вне заданного диапазона не доступно к выбору (e.g. Edge), или доступно к выбору(e.g. Chrome) но невалидно (see {{anch("Validation")}}).</li> </ul> <div class="note"> -<p><strong>Примечание</strong>: Существует возможность использовать {{htmlattrxref("step", "input")}} аттрибут для того, чтобы установить количество дней, которые будут пропущены каждый раз, когда дата увеличивается (например, если Вы хотите сделать доступными для выбора только Субботы). Однако, на момент написание этой статьи это нет эффективной реализации этой функции.</p> +<p><strong>Примечание</strong>: Существует возможность использовать {{htmlattrxref("step", "input")}} атрибут для того, чтобы установить количество дней, которые будут пропущены каждый раз, когда дата увеличивается (например, если Вы хотите сделать доступными для выбора только Субботы). Однако, на момент написание этой статьи это нет эффективной реализации этой функции.</p> </div> <h3 id="Controlling_input_size">Controlling input size</h3> diff --git a/files/ru/web/html/element/input/datetime/index.html b/files/ru/web/html/element/input/datetime/index.html index 6b6b0a2292..5fe53d2c59 100644 --- a/files/ru/web/html/element/input/datetime/index.html +++ b/files/ru/web/html/element/input/datetime/index.html @@ -19,7 +19,7 @@ translation_of: Web/HTML/Element/input/datetime <p>Вместо этого, браузеры реализуют (и разработчикам рекомендуется использовать) <code><a href="/ru/docs/Web/HTML/Element/input/datetime-local"><input type="datetime-local"></a></code>.</p> -<p>Формат значений даты и времени, использумый этим типом описан в {{SectionOnPage("/ru/docs/Web/HTML/Date_and_time_formats", "Строки глобальной даты и времени")}}.</p> +<p>Формат значений даты и времени, используемый этим типом описан в {{SectionOnPage("/ru/docs/Web/HTML/Date_and_time_formats", "Строки глобальной даты и времени")}}.</p> <h2 id="Смотрите_также">Смотрите также</h2> diff --git a/files/ru/web/html/element/input/file/index.html b/files/ru/web/html/element/input/file/index.html index 7e47d3be03..950ee5931f 100644 --- a/files/ru/web/html/element/input/file/index.html +++ b/files/ru/web/html/element/input/file/index.html @@ -41,7 +41,7 @@ translation_of: Web/HTML/Element/input/file <h2 id="Value">Value</h2> -<p>Атрибут {{htmlattrxref("value", "input")}} элемента input содержит {{domxref("DOMString")}}, который представляет путь к выбранным файлам. Если пользователь выбрал несколько файлов, <code>value</code> представляет первый файл из списка. Отстальные файлы можно определить используя {{domxref("HTMLInputElement.files")}} свойство элемента input.</p> +<p>Атрибут {{htmlattrxref("value", "input")}} элемента input содержит {{domxref("DOMString")}}, который представляет путь к выбранным файлам. Если пользователь выбрал несколько файлов, <code>value</code> представляет первый файл из списка. Остальные файлы можно определить используя {{domxref("HTMLInputElement.files")}} свойство элемента input.</p> <div class="note"><strong>Note:</strong> diff --git a/files/ru/web/html/element/input/password/index.html b/files/ru/web/html/element/input/password/index.html index eb87000912..e745967864 100644 --- a/files/ru/web/html/element/input/password/index.html +++ b/files/ru/web/html/element/input/password/index.html @@ -611,4 +611,4 @@ ssn.oninput = function(event) { <p>[3] Поддерживается для элемента {{HTMLElement("select")}}.</p> -<p>[4] Firefox, в отличие от других браузеров, по умолчанию <a href="http://stackoverflow.com/q/5985839/432681">pсохраняет состояние динамического отключения и (если применимо) динамическую проверку</a> из <code><input></code> для загрузки страницы. Установка значения атрибута {{htmlattrxref("autocomplete","input")}} в <code>off</code> отключает эту функцию; это работает, даже если атрибут {{htmlattrxref("autocomplete","input")}} обычно не применяется к <code><input></code> в силу его {{htmlattrxref("type","input")}}. Смотри {{bug(654072)}}.</p> +<p>[4] Firefox, в отличие от других браузеров, по умолчанию <a href="http://stackoverflow.com/q/5985839/432681">сохраняет состояние динамического отключения и (если применимо) динамическую проверку</a> из <code><input></code> для загрузки страницы. Установка значения атрибута {{htmlattrxref("autocomplete","input")}} в <code>off</code> отключает эту функцию; это работает, даже если атрибут {{htmlattrxref("autocomplete","input")}} обычно не применяется к <code><input></code> в силу его {{htmlattrxref("type","input")}}. Смотри {{bug(654072)}}.</p> diff --git a/files/ru/web/html/element/input/range/index.html b/files/ru/web/html/element/input/range/index.html index b46af66650..b099b28018 100644 --- a/files/ru/web/html/element/input/range/index.html +++ b/files/ru/web/html/element/input/range/index.html @@ -12,7 +12,7 @@ translation_of: Web/HTML/Element/input/range <div>{{EmbedInteractiveExample("pages/tabbed/input-range.html", "tabbed-standard")}}</div> -<p class="hidden">Исходный код данного примера расположен в GitHub репозитории. Если вы хотите внести внести изменения в привер, пожалуйста склонируйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> и отправте нам пул реквест.</p> +<p class="hidden">Исходный код данного примера расположен в GitHub репозитории. Если вы хотите внести внести изменения в привер, пожалуйста склонируйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> и отправьте нам пул реквест.</p> <p>Если используемый браузер не поддерживает тип <code>range</code>, он будет отображаться как input<code>{{HTMLElement('input/text', 'text')}}.</code></p> @@ -43,7 +43,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="Валидация">Валидация</h3> -<p>Для этого поля нет доступного патерна валидации, но следующая валидация реализованны следующие проверки</p> +<p>Для этого поля нет доступного паттерна валидации, но следующая валидация реализованы следующие проверки</p> <ul> <li>Если значение {{htmlattrxref("value", "input")}} содержит что-то что не может быть конвертированно в число с плавающей точкой, произойдет ошибка некорректного ввода.</li> @@ -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> @@ -131,11 +131,11 @@ 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"> -<p>Note: Следующие атрибуты не применимы: <code>accept</code>, <code>alt</code>, <code>checked</code>, <code>dirname</code>, <code>formaction</code>, <code>formenctype</code>, <code>formmethod</code>, <code>formnovalidate</code>, <code>formtarget</code>, <code>height</code>, <code>maxlength</code>, <code>minlength</code>, <code>multiple</code>, <code>pattern</code>, <code>placeholder</code>, <code>readonly</code>, <code>required</code>, <code>size</code>, <code>src</code>, и <code>width</code>. Каждый из них будет проигнорирован в случаее употребления.</p> +<p>Note: Следующие атрибуты не применимы: <code>accept</code>, <code>alt</code>, <code>checked</code>, <code>dirname</code>, <code>formaction</code>, <code>formenctype</code>, <code>formmethod</code>, <code>formnovalidate</code>, <code>formtarget</code>, <code>height</code>, <code>maxlength</code>, <code>minlength</code>, <code>multiple</code>, <code>pattern</code>, <code>placeholder</code>, <code>readonly</code>, <code>required</code>, <code>size</code>, <code>src</code>, и <code>width</code>. Каждый из них будет проигнорирован в случае употребления.</p> </div> <h2 id="Examples">Examples</h2> @@ -191,7 +191,7 @@ translation_of: Web/HTML/Element/input/range <p>Так как браузеры имеют эту гибкость, и на сегодняшний день ни один из них не поддерживает все возможности, определенные HTML, представляем несколько макетов, показывающих как вы можете получить на macOS в браузере, который их поддерживает.</p> -<h5 id="Недекорированный_контроллер_даипазона">Недекорированный контроллер даипазона</h5> +<h5 id="Недекорированный_контроллер_диапазона">Недекорированный контроллер диапазона</h5> <p>Этот результат вы получите, если не укажите атрибут {{htmlattrxref("list", "input")}}, или браузер не будет его поддерживать.</p> @@ -282,12 +282,12 @@ translation_of: Web/HTML/Element/input/range </table> <div class="note"> -<p><strong>Примечание</strong>: В настоящее время ни один браузер полностью не поддерживает эти возможности. Firefox не поддрживает хэш-метки и лейблы, например, в то время как Chrome поддерживает хэш-метки, но не поддерживает лейблы. Версия 66 (66.0.3359.181) Chrome поддерживает лейблы, но тэг {{htmlelement("datalist")}} должен быть стилизован с помощью CSS, так как его свойство {{cssxref("display")}} по умолчанию - <code>none</code>, тем самым скрывая лейблы.</p> +<p><strong>Примечание</strong>: В настоящее время ни один браузер полностью не поддерживает эти возможности. Firefox не поддерживает хэш-метки и лейблы, например, в то время как Chrome поддерживает хэш-метки, но не поддерживает лейблы. Версия 66 (66.0.3359.181) Chrome поддерживает лейблы, но тэг {{htmlelement("datalist")}} должен быть стилизован с помощью CSS, так как его свойство {{cssxref("display")}} по умолчанию - <code>none</code>, тем самым скрывая лейблы.</p> </div> <h3 id="Изменение_ориентации">Изменение ориентации</h3> -<p>По умолчанию, если браузер отображает инпут диапозона как слайдер, он отобразит его так чтоб ползунок ездил в право и в лево. Когда поддержка браузерами будет реализованно, можно будет делать слайдер вертикальным, так чтобы ползунок мог ездить вверх и вниз. Ниодин из наиболее используемых браузеров не имплементировал это пока. (Firefox {{bug(981916)}}, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=341071">Chrome bug 341071</a>). также, возможно, <a href="https://github.com/whatwg/html/issues/4177">следующий баг под вопросом</a>.</p> +<p>По умолчанию, если браузер отображает инпут диапазона как слайдер, он отобразит его так чтоб ползунок ездил в право и в лево. Когда поддержка браузерами будет реализовано, можно будет делать слайдер вертикальным, так чтобы ползунок мог ездить вверх и вниз. Ни один из наиболее используемых браузеров не имплементировал это пока. (Firefox {{bug(981916)}}, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=341071">Chrome bug 341071</a>). также, возможно, <a href="https://github.com/whatwg/html/issues/4177">следующий баг под вопросом</a>.</p> <p>В реальности, мы можем сделать слайдер вертикальным используя CSS трансформации, или применяя уникальный метод для каждого браузера в отдельности, включая: настройки {{cssxref('appearance')}} для <code>slider-vertical</code>, использование нестандартной ориентации <code>orient</code> в Firefox,или изменение text direction для Internet Explorer и Edge</p> @@ -301,7 +301,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="Standards">Standards</h3> -<p>Следуюя спецификации, сделать его вертикальным также просто как добавить CSS, чтобы изменить размеры контроллера, чтобы его высота оказалась больше ширины:</p> +<p>Следуя спецификации, сделать его вертикальным также просто как добавить CSS, чтобы изменить размеры контроллера, чтобы его высота оказалась больше ширины:</p> <h4 id="CSS">CSS</h4> @@ -318,11 +318,11 @@ translation_of: Web/HTML/Element/input/range <p>{{EmbedLiveSample("Orientation_sample2", 200, 200, "https://mdn.mozillademos.org/files/14985/Orientation_sample2.png")}}</p> -<p>К сожалению, большенство браузеров сейчас не поддерживают вертикальные контроллы напрямую.</p> +<p>К сожалению, большинство браузеров сейчас не поддерживают вертикальные контроллы напрямую.</p> <h3 id="transform_rotate-90deg">transform: rotate(-90deg)</h3> -<p>Но вы, все же, можете сделать вертикльный контролл используя горизонтальный контролл. Самый простой способ - использовать CSS: применяя {{cssxref("transform")}} для поворото элемента на 90 градусов. Посмотрим:</p> +<p>Но вы, все же, можете сделать вертикальный контролл используя горизонтальный контролл. Самый простой способ - использовать CSS: применяя {{cssxref("transform")}} для поворота элемента на 90 градусов. Посмотрим:</p> <div id="Orientation_sample3"> <h4 id="HTML_2">HTML</h4> @@ -355,7 +355,7 @@ translation_of: Web/HTML/Element/input/range transform: rotate(-90deg); }</pre> -<p>Размеры контроллера это набор из 150 пикселей длины и 20 пикселей высоты. Маржинги установлены на 0 и {{cssxref("transform-origin")}} смещается в середину пространства, на котором вращается слайдер; поскольку слайдер имеет ширину 150 пикселей, он вращается через прямоугольник по 150 пикселей с каждой стороны. Смещение начала координат на 75px по каждой оси означает, что мы будем вращаться вокруг центра этого пространства. Наконец, мы поварачиваем против часовой стрелки на 90°. Результат: инпут range, который вращается таким образом, что максимальное значение находится сверху, а минимальное снизу.</p> +<p>Размеры контроллера это набор из 150 пикселей длины и 20 пикселей высоты. Маржинги установлены на 0 и {{cssxref("transform-origin")}} смещается в середину пространства, на котором вращается слайдер; поскольку слайдер имеет ширину 150 пикселей, он вращается через прямоугольник по 150 пикселей с каждой стороны. Смещение начала координат на 75px по каждой оси означает, что мы будем вращаться вокруг центра этого пространства. Наконец, мы поворачиваем против часовой стрелки на 90°. Результат: инпут range, который вращается таким образом, что максимальное значение находится сверху, а минимальное снизу.</p> <p>{{EmbedLiveSample("Orientation_sample3", 200, 200, "https://mdn.mozillademos.org/files/14987/Orientation_sample3.png")}}</p> @@ -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; @@ -382,11 +382,11 @@ translation_of: Web/HTML/Element/input/range <h3 id="orient_attribute">orient attribute</h3> -<p>В Firefox, реализованно нестандартное свойство <code>orient</code>.</p> +<p>В Firefox, реализовано нестандартное свойство <code>orient</code>.</p> <h4 id="HTML_4">HTML</h4> -<p>Используем тот же HTML что и в предыдущем примере и добавляем атрибут со значением <code>vertical</code>:</p> +<p>Используем тот же HTML что и в предыдущем примере и ддобавляем атрибут со значением <code>vertical</code>:</p> <pre class="notranslate"><input type="range" min="0" max="11" value="7" step="1" orient="vertical"> </pre> @@ -395,7 +395,7 @@ translation_of: Web/HTML/Element/input/range <h3 id="writing-mode_bt-lr">writing-mode: bt-lr;</h3> -<p>Свойство {{cssxref('writing-mode')}} может быть использовано для специальных эфектов </p> +<p>Свойство {{cssxref('writing-mode')}} может быть использовано для специальных эффектов </p> <h4 id="HTML_5">HTML</h4> @@ -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; diff --git a/files/ru/web/html/element/input/tel/index.html b/files/ru/web/html/element/input/tel/index.html index e13cf8729e..fca5203560 100644 --- a/files/ru/web/html/element/input/tel/index.html +++ b/files/ru/web/html/element/input/tel/index.html @@ -5,7 +5,7 @@ translation_of: Web/HTML/Element/input/tel --- <div>{{HTMLRef}}</div> -<p><span class="seoSummary">{{HTMLElement("input")}} элемент типа <code><strong>tel</strong></code> используется чтобы разрешить пользователю вводить и редактировать номер телефона. В отличии от<code><a href="/en-US/docs/Web/HTML/Element/input/email"><input type="email"></a></code> и <code><a href="/en-US/docs/Web/HTML/Element/input/url"><input type="url"></a></code> , введеное значение не проверяется автоматически по определенном формату, перед тем как форма может быть отправлена , потому что форматы телефонных номеров сильно различаются по всему миру</span></p> +<p><span class="seoSummary">{{HTMLElement("input")}} элемент типа <code><strong>tel</strong></code> используется чтобы разрешить пользователю вводить и редактировать номер телефона. В отличии от<code><a href="/en-US/docs/Web/HTML/Element/input/email"><input type="email"></a></code> и <code><a href="/en-US/docs/Web/HTML/Element/input/url"><input type="url"></a></code> , введенное значение не проверяется автоматически по определенном формату, перед тем как форма может быть отправлена , потому что форматы телефонных номеров сильно различаются по всему миру</span></p> <div>{{EmbedInteractiveExample("pages/tabbed/input-tel.html", "tabbed-standard")}}</div> |