diff options
| author | Alexey Pyltsyn <lex61rus@gmail.com> | 2021-03-15 14:29:50 +0300 |
|---|---|---|
| committer | Alexey Pyltsyn <lex61rus@gmail.com> | 2021-03-15 14:29:50 +0300 |
| commit | 55ddd4454665a3c66e3d5b186bc79048468d36e7 (patch) | |
| tree | 5391f1ae01bbcd484387bbc2373492ac9bc89dbc /files/ru/web/guide | |
| parent | 08dc1a1e60063705ccefc1eb4ef0a17d1ddf196b (diff) | |
| download | translated-content-55ddd4454665a3c66e3d5b186bc79048468d36e7.tar.gz translated-content-55ddd4454665a3c66e3d5b186bc79048468d36e7.tar.bz2 translated-content-55ddd4454665a3c66e3d5b186bc79048468d36e7.zip | |
Auto fixes
Diffstat (limited to 'files/ru/web/guide')
13 files changed, 62 insertions, 62 deletions
diff --git a/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html b/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html index cc4f352353..2fc93f687e 100644 --- a/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html +++ b/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html @@ -31,9 +31,9 @@ translation_of: >- <p>В этой статье мы сошлемся на text tracks, отображаемые как субтистры, т.к их контент направлен на слышащих людей, со сложностью понимания языка в фильме, а не на людей с плохим или отсутствием слуха.</p> -<h3 id="Елемент_<track>">Елемент <track> </h3> +<h3 id="Элемент_<track>">Элемент <track> </h3> -<p>HTML5 позволяет нам указать субтитры для видео, используя {{ htmlelement("track") }} елемент. Различные атрибуты этого элемента позволяют нам указать такие вещи как тип контента, который мы хотим разместить, язык и конечно ссылку на текстовый файл который содержит информацию о субтитрах. </p> +<p>HTML5 позволяет нам указать субтитры для видео, используя {{ htmlelement("track") }} элемент. Различные атрибуты этого элемента позволяют нам указать такие вещи как тип контента, который мы хотим разместить, язык и конечно ссылку на текстовый файл который содержит информацию о субтитрах. </p> <h3 id="WebVTT">WebVTT</h3> @@ -43,13 +43,13 @@ translation_of: >- <h2 id="Modifications_to_the_HTML_and_CSS">Modifications to the HTML and CSS</h2> -<p>В этом разделе представлены модификции, сделанные в коде предыдущих статей, для того чтобы облегчить добавление субтитров в видео. Если вам это не интересно и вы просто хотите идти дальше в JavaScript и более соотвествующий CSS, пропустите {{ anch("Subtitle implementation") }} раздел.</p> +<p>В этом разделе представлены модификации, сделанные в коде предыдущих статей, для того чтобы облегчить добавление субтитров в видео. Если вам это не интересно и вы просто хотите идти дальше в JavaScript и более соответствующий CSS, пропустите {{ anch("Subtitle implementation") }} раздел.</p> <p>В этом примере мы используем другое видео, <a href="http://www.sintel.org/">Sintel</a>, так как оно имеет больше речи и следовательно лучше иллюстрирует работу субтитров.</p> <h3 id="HTML_Markup">HTML Markup</h3> -<p>Как упоминалось выше, нам необходимо использовать новый HTML5 <code><track></code> чтобы добавить файл с субтитрами в HTML5 Video. У нас уже имеется субтритры в 3х различных локалях, такие как English, German и Spanish, что ж теперь мы привяжем все 3 соотвествующих VTT файла, добавляя <code><track></code> внутрь нашего HTML5 <code><video></code> элемента: </p> +<p>Как упоминалось выше, нам необходимо использовать новый HTML5 <code><track></code> чтобы добавить файл с субтитрами в HTML5 Video. У нас уже имеется субтритры в 3х различных локалях, такие как English, German и Spanish, что ж теперь мы привяжем все 3 соответствующих VTT файла, добавляя <code><track></code> внутрь нашего HTML5 <code><video></code> элемента: </p> <pre class="brush: html"><video id="video" controls preload="metadata"> <source src="video/sintel-short.mp4" type="video/mp4"> @@ -90,7 +90,7 @@ translation_of: >- <p>Видео контроллеры подверглись некоторым изменениям, чтобы сделать пространство для новой кнопки, но эти изменения относительно просты.</p> -<p>В подписи кнопки не изпользовано никаких изображений, поэтому это просто стилизовано как: </p> +<p>В подписи кнопки не использовано никаких изображений, поэтому это просто стилизовано как: </p> <pre class="brush: css">.controls button[data-state="subtitles"] { height:85%; @@ -113,7 +113,7 @@ translation_of: >- <h3 id="Initial_setup">Initial setup</h3> -<p>Как и со всеми другими конопками, одно из первых вещеей, которые мы должны сделать - это получить дескриптор нашей кноки субтитров:</p> +<p>Как и со всеми другими кнопками, одно из первых вещей, которые мы должны сделать - это получить дескриптор нашей кнопки субтитров:</p> <pre class="brush: js">var subtitles = document.getElementById('subtitles');</pre> @@ -123,7 +123,7 @@ translation_of: >- video.textTracks[i].mode = 'hidden'; }</pre> -<p>Свойство <code>video.textTracks</code> содержит массив всех текстовых треков, присоединных к видео. Мы проходим по каждому и утанавливаем его <code>mode</code> в <code>hidden</code></p> +<p>Свойство <code>video.textTracks</code> содержит массив всех текстовых треков, присоединенных к видео. Мы проходим по каждому и устанавливаем его <code>mode</code> в <code>hidden</code></p> <p>Примечание: <a href="http://dev.w3.org/html5/webvtt/#api">WebVTT API</a> дает нам доступ ко всем текстовым трекам, что определены в HTML5 video, c помощью элемента <code><track></code></p> diff --git a/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html b/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html index 48e7b00f6c..e4d2637356 100644 --- a/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html +++ b/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html @@ -32,7 +32,7 @@ var bufferedTimeRanges = myAudio.buffered;</pre> <h2 id="Объект_TimeRanges">Объект TimeRanges</h2> -<p>TimeRanges cодержит данные о частях буферизованных участков медиафайла (один или более — сколько успело буферизоваться) (<a href="https://developer.mozilla.org/en-US/docs/Web/API/TimeRanges">Узнать больше о TimeRanges</a>).</p> +<p>TimeRanges содержит данные о частях буферизованных участков медиафайла (один или более — сколько успело буферизоваться) (<a href="https://developer.mozilla.org/en-US/docs/Web/API/TimeRanges">Узнать больше о TimeRanges</a>).</p> <p>Объект {{ domxref("TimeRanges") }} имеет следующие свойства:</p> diff --git a/files/ru/web/guide/css/block_formatting_context/index.html b/files/ru/web/guide/css/block_formatting_context/index.html index 599d22764b..0114b27893 100644 --- a/files/ru/web/guide/css/block_formatting_context/index.html +++ b/files/ru/web/guide/css/block_formatting_context/index.html @@ -30,7 +30,7 @@ translation_of: Web/Guide/CSS/Block_formatting_context <li>флекс-элементы (непосредственные потомки элемента с {{ cssxref("display") }}<code>: flex</code> или <code>inline-flex</code>)</li> <li>грид-элементы (непосредственные потомки элемента с {{ cssxref("display") }}<code>: grid</code> или <code>inline-grid</code>)</li> <li>многоколоночные контейнеры (элементы, у которых {{ cssxref("column-count") }} или {{ cssxref("column-width") }} не равно <code>auto</code>, включая элементы с <code>column-count: 1</code>)</li> - <li>{{ cssxref("column-span") }}<code>: all</code> должно всегда создавать новый блочный контекст форматирования, даже если элемент с <code>column-span: all</code> не находится в многоголоночном контейнере (<a href="https://github.com/w3c/csswg-drafts/commit/a8634b96900279916bd6c505fda88dda71d8ec51">изменение в спецификации</a>, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=709362">баг Chrome</a>).</li> + <li>{{ cssxref("column-span") }}<code>: all</code> должно всегда создавать новый блочный контекст форматирования, даже если элемент с <code>column-span: all</code> не находится в многоколоночном контейнере (<a href="https://github.com/w3c/csswg-drafts/commit/a8634b96900279916bd6c505fda88dda71d8ec51">изменение в спецификации</a>, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=709362">баг Chrome</a>).</li> </ul> <p>Блочный контекст форматирования применяется ко всему содержимому того элемента, который его создал.</p> @@ -90,7 +90,7 @@ translation_of: Web/Guide/CSS/Block_formatting_context <p>{{EmbedLiveSample("flowroot", 200, 200)}}</p> </div> -<p>С помощью <code>display: flow-root;</code> применённом на элементе <code><div></code>, всё внутри этого контейнера будет учавствовать в едином блочном контексте форматирования этого контейнера, и плавающие элементы не будут торчать из нижней части контейнера.</p> +<p>С помощью <code>display: flow-root;</code> применённом на элементе <code><div></code>, всё внутри этого контейнера будет участвовать в едином блочном контексте форматирования этого контейнера, и плавающие элементы не будут торчать из нижней части контейнера.</p> <p>Задание значения <code>flow-root</code> имеет смысл тогда, когда Вы понимаете, что Вы создаёте что-то, что будет действовать так же, как действует корневой <code>root</code> элемент (<code><html></code> в браузерах) в том плане, что он создаёт новый контекст для компоновки потока внутри него.</p> diff --git a/files/ru/web/guide/events/creating_and_triggering_events/index.html b/files/ru/web/guide/events/creating_and_triggering_events/index.html index f766a93097..5502179fae 100644 --- a/files/ru/web/guide/events/creating_and_triggering_events/index.html +++ b/files/ru/web/guide/events/creating_and_triggering_events/index.html @@ -9,7 +9,7 @@ tags: translation_of: Web/Guide/Events/Creating_and_triggering_events original_slug: Web/Guide/Events/Создание_и_вызов_событий --- -<p>Эта статья демонстрирует, как создавать и вызывать пользовательские DOM-события. Такие события часто называют <strong>исскуственными</strong> событиями, по отношению к событиям, производимым браузером.</p> +<p>Эта статья демонстрирует, как создавать и вызывать пользовательские DOM-события. Такие события часто называют <strong>искусственными</strong> событиями, по отношению к событиям, производимым браузером.</p> <h2 id="Создание_собственных_событий">Создание собственных событий</h2> diff --git a/files/ru/web/guide/events/index.html b/files/ru/web/guide/events/index.html index ccf1d5b353..e670fc0d15 100644 --- a/files/ru/web/guide/events/index.html +++ b/files/ru/web/guide/events/index.html @@ -27,9 +27,9 @@ translation_of: Web/Guide/Events <p><span id="result_box" lang="ru"><span class="hps">Остальные</span> <span class="hps">страницы описывают</span><span>, как использовать</span> <span class="hps">события разных</span> <span class="hps">видов</span><span>, определенных</span> <span class="hps">в веб-браузерах</span><span>.</span> <span class="hps">К сожалению,</span> <span class="hps">эти события</span> <span class="hps">были определены</span> <span class="hps">по частям</span><span>,</span> <span class="atn hps">веб-</span><span>браузеры</span> <span class="hps">развивались</span> <span class="hps">таким образом, что</span> <span class="hps">нет</span> <span class="hps">удовлетворения</span> <span class="hps">систематическим</span> <span class="hps">характеристикам</span> <span class="hps">событий</span> <span class="hps">встроенным</span> <span class="hps">или</span> <span class="hps">определенным</span> в <span class="atn hps">современных веб-</span><span>браузерах.</span></span></p> -<p><span id="result_box" lang="ru"><span><strong>Устройство</strong>, на котором</span> <span class="atn hps">работа веб-</span><span>браузера</span> <span class="hps">может спровоцировать</span> <span class="hps">событие</span><span>, например</span> <span class="hps">связанное с</span> <span class="hps">изменением его</span> <span class="hps">положения и ориентации</span> <span class="hps">в реальном мире</span><span>,</span> <span class="hps">частично описано</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained">page on orientation coordinate systems</a> и <a href="/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms">page on the use of 3D transforms</a>. Они<span id="result_box" lang="ru"> <span class="hps">разные, но</span> <span class="hps">похожи</span><span>,</span> <span class="hps">с измененой</span> <span class="hps">вертикальной ориентации</span> <span class="hps">устройства</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><span><strong>Устройство</strong>, на котором</span> <span class="atn hps">работа веб-</span><span>браузера</span> <span class="hps">может спровоцировать</span> <span class="hps">событие</span><span>, например</span> <span class="hps">связанное с</span> <span class="hps">изменением его</span> <span class="hps">положения и ориентации</span> <span class="hps">в реальном мире</span><span>,</span> <span class="hps">частично описано</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained">page on orientation coordinate systems</a> и <a href="/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms">page on the use of 3D transforms</a>. Они<span id="result_box" lang="ru"> <span class="hps">разные, но</span> <span class="hps">похожи</span><span>,</span> <span class="hps">с измененной</span> <span class="hps">вертикальной ориентации</span> <span class="hps">устройства</span><span>.</span></span></p> -<p><span id="result_box" lang="ru"><strong><span>Окно в котором</span> <span class="hps">отображается</span> <span class="hps">браузер</span></strong> <span class="hps">может вызвать</span> <span class="hps">события</span><span>, к примеру</span><span>,</span> <span class="hps">измененить размер</span><span>, если пользователь</span> <span class="hps">максимизирует</span> <span class="hps">окно или</span> <span class="hps">изменит его размер</span><span>.</span></span></p> +<p><span id="result_box" lang="ru"><strong><span>Окно в котором</span> <span class="hps">отображается</span> <span class="hps">браузер</span></strong> <span class="hps">может вызвать</span> <span class="hps">события</span><span>, к примеру</span><span>,</span> <span class="hps">изменить размер</span><span>, если пользователь</span> <span class="hps">максимизирует</span> <span class="hps">окно или</span> <span class="hps">изменит его размер</span><span>.</span></span></p> <p><span id="result_box" lang="ru"><strong><span>Процесс загрузки</span></strong> <span class="hps">веб-страницы</span> <span class="hps">может вызвать</span> <span class="hps">ответное событие</span><span class="hps"> на завершение</span> <span class="hps">различных</span> <span class="hps">этапо</span><span class="hps">в</span> <span class="hps">загрузки,</span> анализирования <span class="hps">и перевода</span> <span class="hps">веб-страниц</span> <span class="hps">отображаемых пользователю</span><span>.</span></span></p> @@ -39,7 +39,7 @@ translation_of: Web/Guide/Events <li>обычное событие при нажатии,</li> <li>событие, активированное мышью,</li> <li><a href="/en-US/docs/Web/Guide/API/DOM/Events/Mouse_gesture_events">событие жеста мышью</a>,</li> - <li><a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events">события нажатия на экран</a> и устаревшие <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events_(Mozilla_experimental)">экспериментальные события нажания на экран (от Mozilla)</a>.</li> + <li><a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events">события нажатия на экран</a> и устаревшие <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events_(Mozilla_experimental)">экспериментальные события нажатия на экран (от Mozilla)</a>.</li> </ul> <p><span id="result_box" lang="ru"><strong><span>Модификация</span> <span class="hps">в структуре веб-страницы</span> <span class="hps">или содержании</span></strong> <span class="hps">может быть</span> <span class="hps">вызвано некоторым</span> <span class="hps">событием</span><span>, </span> <span class="hps">описанным в</span></span> <a href="/en-US/docs/Web/Guide/API/DOM/Events/Mutation_events">mutation events page</a><span id="result_box" lang="ru"><span class="hps">, но</span> их<span class="hps"> использование </span> <span class="hps">устарело в</span> <span class="hps">пользу более </span><span class="hps">легкого</span></span> <a href="/en-US/docs/Web/API/MutationObserver">Mutation Observer</a> подхода.</p> @@ -51,7 +51,7 @@ translation_of: Web/Guide/Events <p><span id="result_box" lang="ru"><span class="hps">Есть</span> <span class="hps">много других источников</span> <span class="hps">событий, определенных</span> <span class="hps">в веб-браузере</span><span>,</span> <span class="hps">страницы которых</span> <span class="hps">пока не доступны</span> <span class="hps">в данном руководстве</span><span>.</span></span></p> <div class="note"> -<p><span id="result_box" lang="ru"><span class="hps">Примечание</span><span>:</span> <span class="hps">Это руководство</span> <span class="hps">событие</span> <span class="hps">Разработчик</span>а <span class="hps">нуждается в существенной</span> <span class="hps">работе</span><span>.</span><span>Структура должна</span> <span class="hps">быть</span> <span class="hps">реорганизована</span> <span class="hps">и страницы</span> <span class="hps">переписаны.</span> <span class="hps">Мы надеемся, что</span> <span class="hps">все, что вы</span><span class="hps"> знаете и должны знать</span> <span class="hps">о событиях</span> <span class="hps">будет опубликованно</span> <span class="hps">здесь.</span></span></p> +<p><span id="result_box" lang="ru"><span class="hps">Примечание</span><span>:</span> <span class="hps">Это руководство</span> <span class="hps">событие</span> <span class="hps">Разработчик</span>а <span class="hps">нуждается в существенной</span> <span class="hps">работе</span><span>.</span><span>Структура должна</span> <span class="hps">быть</span> <span class="hps">реорганизована</span> <span class="hps">и страницы</span> <span class="hps">переписаны.</span> <span class="hps">Мы надеемся, что</span> <span class="hps">все, что вы</span><span class="hps"> знаете и должны знать</span> <span class="hps">о событиях</span> <span class="hps">будет опубликовано</span> <span class="hps">здесь.</span></span></p> </div> <h2 id="Docs">Docs</h2> diff --git a/files/ru/web/guide/events/media_events/index.html b/files/ru/web/guide/events/media_events/index.html index 655e71ec61..a3a13cc821 100644 --- a/files/ru/web/guide/events/media_events/index.html +++ b/files/ru/web/guide/events/media_events/index.html @@ -34,7 +34,7 @@ translation_of: Web/Guide/Events/Media_events </tr> <tr> <td><code>{{event("emptied")}}</code></td> - <td>Медиа стало пустым. Например, это событие отправляется, если медиа уже загружено (или частично заргужено), и метод <a class="internal" href="/En/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" title="en/nsIDOMHTMLMediaElement"><code>load()</code></a> был вызван что бы его перезагрузить.</td> + <td>Медиа стало пустым. Например, это событие отправляется, если медиа уже загружено (или частично загружено), и метод <a class="internal" href="/En/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" title="en/nsIDOMHTMLMediaElement"><code>load()</code></a> был вызван что бы его перезагрузить.</td> </tr> <tr> <td>encrypted <span style="line-height: 1.5;">{{experimental_inline}}</span></td> @@ -54,7 +54,7 @@ translation_of: Web/Guide/Events/Media_events </tr> <tr> <td><code>interruptend</code></td> - <td>Отправляется, когда ранее прерванное воспроизвдеение на Firefox OS устройстве продолжает воспроизведение. См. <a href="/en-US/docs/Web/API/AudioChannels_API/Using_the_AudioChannels_API">Using the AudioChannels API</a></td> + <td>Отправляется, когда ранее прерванное воспроизведение на Firefox OS устройстве продолжает воспроизведение. См. <a href="/en-US/docs/Web/API/AudioChannels_API/Using_the_AudioChannels_API">Using the AudioChannels API</a></td> </tr> <tr> <td><code>{{event("loadeddata")}}</code></td> @@ -106,7 +106,7 @@ translation_of: Web/Guide/Events/Media_events </tr> <tr> <td><code>{{event("suspend")}}</code></td> - <td>Отправляется, когда загрузка медиа приостановлена. Это может прозойти как потому, что загрузка была завершена, так и по другим причинам.</td> + <td>Отправляется, когда загрузка медиа приостановлена. Это может произойти как потому, что загрузка была завершена, так и по другим причинам.</td> </tr> <tr> <td><code>{{event("timeupdate")}}</code></td> diff --git a/files/ru/web/guide/events/overview_of_events_and_handlers/index.html b/files/ru/web/guide/events/overview_of_events_and_handlers/index.html index b9f689caa2..0f457ad8b2 100644 --- a/files/ru/web/guide/events/overview_of_events_and_handlers/index.html +++ b/files/ru/web/guide/events/overview_of_events_and_handlers/index.html @@ -4,23 +4,23 @@ slug: Web/Guide/Events/Overview_of_Events_and_Handlers translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers --- <div class="summary"> -<p>Эта обзорная статья о событиях и их обработчиках описывает шаблон проектирования кода, который используется для реагирования на события, возникающие, когда браузер получает доступ к web-странице, и содержит подборку типов подобных событий, которые современные брауезеры могут обрабатывать.</p> +<p>Эта обзорная статья о событиях и их обработчиках описывает шаблон проектирования кода, который используется для реагирования на события, возникающие, когда браузер получает доступ к web-странице, и содержит подборку типов подобных событий, которые современные браузеры могут обрабатывать.</p> </div> <p>События и их обработчики представляют собой основную технику в JavaScript для реагирования на события, возникающие, когда браузер получает доступ к web-странице, включая события о подготовке страницы к отображению, взаимодействии с ее содержимым, в зависимости от устройства, на котором браузер был запущен, и многие другие случаи, такие как воспроизведение потоковой медиа-информации или расчет времени анимации.</p> -<p>События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпановке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети<em>,</em> скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы<em>,</em> нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи <em>"Неудобные API: Теория DOM",</em> которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.</p> +<p>События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпоновке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети<em>,</em> скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы<em>,</em> нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи <em>"Неудобные API: Теория DOM",</em> которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.</p> <div style="margin: 0 auto; width: 68%;"><img alt="A comparison of the sequential and event-driven browser load sequences." src="https://mdn.mozillademos.org/files/6641/Browser_sequence_comparitive.svg" style="height: 454px; width: 1857px;"></div> -<p>Второй подход изменяет последние шаги, переходя от просторого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая <a href="http://www.youtube.com/watch?v=Y2Y0U-2qJMs">этот</a>.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.</p> +<p>Второй подход изменяет последние шаги, переходя от простого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая <a href="http://www.youtube.com/watch?v=Y2Y0U-2qJMs">этот</a>.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.</p> <h2 id="Шаблон_проектирования_событий">Шаблон проектирования событий</h2> <p>Система событий, по своей сути, простой программный шаблон проектирования. Он начинается с соглашения о виде события и:</p> <ul> - <li>имени-строки, используемой для собыйтия,</li> + <li>имени-строки, используемой для события,</li> <li>типа структуры данных, используемых для представления ключевых свойств события,</li> <li>объекта JavaScript, который будет 'вызывать' это событие.</li> </ul> @@ -32,13 +32,13 @@ translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers <li>регистрации функции с помощью имени-строки через объект, который будет вызывать событие.</li> </ul> -<p>Функция считается "слушателем" или "обработчиком", где оба именами взаимнозаменяемы. Этому шаблону можно легко следовать с использованием полностью пользовательского кода, как объяснено в <a href="/en-US/docs/Web/Guide/API/DOM/Events/Creating_and_triggering_events">статье о пользовательских событиях</a>. Шаблон так же используется современными web-браузерами, определяющими множество событий, которые вызываются в ответ на пользовательский ввод или активность браузера.</p> +<p>Функция считается "слушателем" или "обработчиком", где оба именами взаимозаменяемы. Этому шаблону можно легко следовать с использованием полностью пользовательского кода, как объяснено в <a href="/en-US/docs/Web/Guide/API/DOM/Events/Creating_and_triggering_events">статье о пользовательских событиях</a>. Шаблон так же используется современными web-браузерами, определяющими множество событий, которые вызываются в ответ на пользовательский ввод или активность браузера.</p> -<p>Современные браузеры следуют событийному шаблону, используя стандартизированный подход. В качестве структуры данных для свойств события они применяют объект, полученный от объекта <code>EventPrototype</code>. Для регистратрации функции, которая будет обрабатывать эту структуру даных, используется метод, называемый <code>addEventListener</code>, который ожидает в качестве аргумента имя-строку, соответствующую типу события, и функцию-обработчика. В итоге, браузеры определяют огромное число объектов источников событий и широкое разнообразие типов событий, сформированных объектами.</p> +<p>Современные браузеры следуют событийному шаблону, используя стандартизированный подход. В качестве структуры данных для свойств события они применяют объект, полученный от объекта <code>EventPrototype</code>. Для регистратрации функции, которая будет обрабатывать эту структуру данных, используется метод, называемый <code>addEventListener</code>, который ожидает в качестве аргумента имя-строку, соответствующую типу события, и функцию-обработчика. В итоге, браузеры определяют огромное число объектов источников событий и широкое разнообразие типов событий, сформированных объектами.</p> <h2 id="Button_Event_Handler" name="Button_Event_Handler">Пример обработчика события кнопки</h2> -<p>К примеру, браузерный элемент <code>button</code> предназначен для вызова события с именем <code>'click'</code> в ответ на нажатие кнопки мыши или прикосновене пальца к чувствительной части экрана. В HTML мы можем определить <code>button</code> как:</p> +<p>К примеру, браузерный элемент <code>button</code> предназначен для вызова события с именем <code>'click'</code> в ответ на нажатие кнопки мыши или прикосновение пальца к чувствительной части экрана. В HTML мы можем определить <code>button</code> как:</p> <pre class="brush: html"><button id="buttonOne">Click here to emit a 'click' event</button></pre> @@ -49,7 +49,7 @@ translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers alert("We got a click event at " + ev.timeStamp + " with an argument object derived from: " + objKind ); };</pre> -<p>и затем зарегестрировать свою функцию с помощью объекта <code>Button</code> или со стороны скрипта, используя представление DOM (Document Object Model) на HTML-странице:</p> +<p>и затем зарегистрировать свою функцию с помощью объекта <code>Button</code> или со стороны скрипта, используя представление DOM (Document Object Model) на HTML-странице:</p> <pre class="brush: js">var buttonDOMElement = document.querySelector('#buttonOne'); buttonDOMElement.addEventListener('click', example_click_handler);</pre> @@ -58,7 +58,7 @@ buttonDOMElement.addEventListener('click', example_click_handler);</pre> <p>{{ EmbedLiveSample('Button_Event_Handler') }}</p> -<p>Этот код полагается на соглашение о том, что существует некоторый вид события, называемый <code>'click'</code> , который вызовет все функции-слушатели (или 'обработчи') с объектом-аргументом <code>Event</code> (на данный момент, в этом случае производный от объекта <code>MouseEvent</code> ) и будет запущен после манипуляций пользователя с элементами <code>button</code> на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, <code>buttonDOMElement</code> объекта JavaScript вызовет функцию <code>example_click_handler</code> с объектом <code>Event</code> в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту <code>ev</code>, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.</p> +<p>Этот код полагается на соглашение о том, что существует некоторый вид события, называемый <code>'click'</code> , который вызовет все функции-слушатели (или 'обработчик') с объектом-аргументом <code>Event</code> (на данный момент, в этом случае производный от объекта <code>MouseEvent</code> ) и будет запущен после манипуляций пользователя с элементами <code>button</code> на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, <code>buttonDOMElement</code> объекта JavaScript вызовет функцию <code>example_click_handler</code> с объектом <code>Event</code> в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту <code>ev</code>, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.</p> <p>Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обернут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:</p> @@ -71,7 +71,7 @@ document.addEventListener('DOMContentLoaded', funcInit); <p>так что этот код будет вызван только после того, как объект <code>document</code> вызовет событие <code>'DOMContentLoaded'</code>, потому что HTML был проанализирован и были созданы объекты Javasript, представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передает аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.</p> -<p>Шаблон легко изучить и внедрить. Сложность с событиями возникает из-за необходимости изучить большое разнообразие событий, которые представлены в современных web-браузерах. Так же есть некоторая сложность в понимании, как писать обработчики, так как данный код работает ассинхронно и потенциально может быть вызван несколько раз подряд, но в немного другой ситуации.</p> +<p>Шаблон легко изучить и внедрить. Сложность с событиями возникает из-за необходимости изучить большое разнообразие событий, которые представлены в современных web-браузерах. Так же есть некоторая сложность в понимании, как писать обработчики, так как данный код работает асинхронно и потенциально может быть вызван несколько раз подряд, но в немного другой ситуации.</p> <h2 id="Важные_события">Важные события</h2> @@ -93,12 +93,12 @@ document.addEventListener('DOMContentLoaded', funcInit); <p>Некоторые события, которые стоит отметить:</p> <div class="note"> -<p><strong>Заметка:</strong> Этот список событий будет нуждаться в доработке, чтобы соответствовать действительности; эта работа ожидает некоторой глобальной реорганизации в документе. Так же нужно найти хорошее объяснение событий, включая события во время загрузки страницы, таких, как частично описаных в <em><a href="http://ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload">этой статье</a> или <a href="http://stackoverflow.com/questions/1795438/load-and-execution-sequence-of-a-web-page">этом вопросе на Stack Overflow</a>. </em></p> +<p><strong>Заметка:</strong> Этот список событий будет нуждаться в доработке, чтобы соответствовать действительности; эта работа ожидает некоторой глобальной реорганизации в документе. Так же нужно найти хорошее объяснение событий, включая события во время загрузки страницы, таких, как частично описанных в <em><a href="http://ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload">этой статье</a> или <a href="http://stackoverflow.com/questions/1795438/load-and-execution-sequence-of-a-web-page">этом вопросе на Stack Overflow</a>. </em></p> </div> <ul> <li>глобальный объект <a href="/en-US/docs/Web/API/Window"><code>window</code></a> вызывает событие, называемое <a href="/en-US/docs/Web/Reference/Events/load_(ProgressEvent)"><code>'load'</code></a>, когда страница закончила рендеринг, подразумевая, что все ресурсы были скачаны и применены, так что скрипт был выполнен и изображения отображены,</li> - <li>глобальный объект <a href="/en-US/docs/Web/API/Window"><code>window</code></a> вызывает событие, называемое <a href="/en-US/docs/Web/Reference/Events/resize"><code>'resize'</code></a>, когда высота или ширина окна браузера была измененеа пользователем,</li> + <li>глобальный объект <a href="/en-US/docs/Web/API/Window"><code>window</code></a> вызывает событие, называемое <a href="/en-US/docs/Web/Reference/Events/resize"><code>'resize'</code></a>, когда высота или ширина окна браузера была изменена пользователем,</li> <li>объект DOM <a href="/en-US/docs/Web/API/Document"><code>document</code></a>, представляющий HTML-документ, вызывает событие, называемое <code><a href="/en-US/docs/Web/Reference/Events/DOMContentLoaded">'DOMContentLoaded'</a></code>, когда документ закончил загрузку,</li> <li>объект узла DOM, такой как <a href="/en-US/docs/Web/HTML/Element/div"><code>div</code></a> или <a href="/en-US/docs/Web/HTML/Element/button"><code>button</code></a>, вызывающий событие, называемое <a href="/en-US/docs/Web/Reference/Events/click"><code>'click'</code></a>, когда пользователь нажимает кнопку мыши, пока ее указатель находится поверх узла DOM на HTML-странице.</li> </ul> @@ -109,10 +109,10 @@ document.addEventListener('DOMContentLoaded', funcInit); <p>Web-браузер определяет множество событий различного вида. Каждое описание включает, как структуру данных, передающуюся в обработчика, объект, который наследуется от объекта <code>EventPrototype</code>.</p> -<p>Частичная диаграма иерархии класса объекта событий:</p> +<p>Частичная диаграмма иерархии класса объекта событий:</p> <div class="note"> -<p><strong>Заметка:</strong> Эта диаграма неполная.</p> +<p><strong>Заметка:</strong> Эта диаграмма неполная.</p> </div> <p><img alt="" src="https://mdn.mozillademos.org/files/6633/Js_Event_Object_Hierarchy.svg" style="height: 496px; width: 1417px;"></p> @@ -121,7 +121,7 @@ document.addEventListener('DOMContentLoaded', funcInit); <h2 id="Документации">Документации</h2> -<p>Три ресурса на MDN (Mozilla Developer Network) частично полезные для программистов, желащих работать с событиями:</p> +<p>Три ресурса на MDN (Mozilla Developer Network) частично полезные для программистов, желающих работать с событиями:</p> <ul> <li><a href="/en-US/docs/Web/Guide/API/DOM/Events">Гайд по событиям</a>, который является частью <a href="/en-US/docs/Web/Guide">Web Developers' Guide</a>,</li> diff --git a/files/ru/web/guide/html/content_categories/index.html b/files/ru/web/guide/html/content_categories/index.html index 7a7b3eb1fe..16e41106a0 100644 --- a/files/ru/web/guide/html/content_categories/index.html +++ b/files/ru/web/guide/html/content_categories/index.html @@ -108,7 +108,7 @@ translation_of: Web/Guide/HTML/Content_categories <h3 id="Контент_форм">Контент форм</h3> -<p>Контент форм включает в себя элементы, у которых есть владелец формы, обозначенный атрибутом <strong>form</strong>. Владелецем формы является либо элемент {{HTMLElement("form")}}, либо элемент, id которого указан в атрибуте <strong>form</strong>.</p> +<p>Контент форм включает в себя элементы, у которых есть владелец формы, обозначенный атрибутом <strong>form</strong>. Владельцем формы является либо элемент {{HTMLElement("form")}}, либо элемент, id которого указан в атрибуте <strong>form</strong>.</p> <ul> <li>{{HTMLElement("button")}}</li> diff --git a/files/ru/web/guide/html/html5/constraint_validation/index.html b/files/ru/web/guide/html/html5/constraint_validation/index.html index cad42baedb..6276de0ced 100644 --- a/files/ru/web/guide/html/html5/constraint_validation/index.html +++ b/files/ru/web/guide/html/html5/constraint_validation/index.html @@ -6,7 +6,7 @@ tags: translation_of: Web/Guide/HTML/HTML5/Constraint_validation original_slug: HTML/HTML5/Constraint_validation --- -<p>Создание веб форм всегда было комплексной задачей. В то время как сама по себе разметка формы - задача не сложная, проверка каждого поля на валидность - сложнее, а информирование юзера о проблеме - может стать головной болью. Стандарт <a href="/en-US/docs/Web/Guide/HTML/HTML5" title="en/HTML/HTML5">HTML5</a> предоставил новые механизмы для форм: были добавлены новые семантические типы для элемента {{ HTMLElement("input") }} и <em>обязательная валидация, </em>чтобы облегчить работу по проверке содержимого формы на стороне браузера. Проще говоря, обычная проверка может быть выполнена без JavaScript, простой установкой новых аттрибутов; более сложные ограничения могут быть реализованы через HTML5 <a href="/en-US/docs/Web/Guide/HTML/Forms_in_HTML#Constraint_Validation_API" title="en/HTML/HTML5/Forms in HTML5#Constraint Validation API">Constraint Validation API</a>.</p> +<p>Создание веб форм всегда было комплексной задачей. В то время как сама по себе разметка формы - задача не сложная, проверка каждого поля на валидность - сложнее, а информирование юзера о проблеме - может стать головной болью. Стандарт <a href="/en-US/docs/Web/Guide/HTML/HTML5" title="en/HTML/HTML5">HTML5</a> предоставил новые механизмы для форм: были добавлены новые семантические типы для элемента {{ HTMLElement("input") }} и <em>обязательная валидация, </em>чтобы облегчить работу по проверке содержимого формы на стороне браузера. Проще говоря, обычная проверка может быть выполнена без JavaScript, простой установкой новых атрибутов; более сложные ограничения могут быть реализованы через HTML5 <a href="/en-US/docs/Web/Guide/HTML/Forms_in_HTML#Constraint_Validation_API" title="en/HTML/HTML5/Forms in HTML5#Constraint Validation API">Constraint Validation API</a>.</p> <div class="note"><strong>Внимание:</strong> HTML5 Constraint validation не отменяет валидацию <em>на стороне сервера</em>. Несмотря на то что на сервер будет отправляться меньше запросов с невалидными данными, такие запросы всё ещё могут быть отправлены менее "сговорчивыми" браузерами (например, браузерами без поддержки HTML5 и без JavaScript) или плохими парнями, пытающимися взломать ваше веб-приложение. Следовательно, как и в случае с HTML4, вам всё ещё нужно проверять ввод на стороне сервера, таким образом, чтобы это было согласовано с валидацией на стороне клиента.</div> @@ -15,13 +15,13 @@ original_slug: HTML/HTML5/Constraint_validation <p>В HTML5, базовые ограничения описываются двумя способами:</p> <ul> - <li>Использованием наиболее семантически подходящего значения для {{ htmlattrxref("type", "input") }} аттрибута элемента {{ HTMLElement("input") }}, например, выбор типа <span style="font-family: courier new;">email</span> автоматически создаёт ограничение, которое проверяет, является ли значение e-mail адресом.</li> - <li>Установкой значений для аттрибутов, связанных с валидацией, описывая базовые ограничения без использования JavaScript.</li> + <li>Использованием наиболее семантически подходящего значения для {{ htmlattrxref("type", "input") }} атрибута элемента {{ HTMLElement("input") }}, например, выбор типа <span style="font-family: courier new;">email</span> автоматически создаёт ограничение, которое проверяет, является ли значение e-mail адресом.</li> + <li>Установкой значений для атрибутов, связанных с валидацией, описывая базовые ограничения без использования JavaScript.</li> </ul> <h3 id="Семантические_типы_input-ов">Семантические типы input-ов</h3> -<p>Аттрибуты, присущие элементам {{ htmlattrxref("type", "input") }}:</p> +<p>Атрибуты, присущие элементам {{ htmlattrxref("type", "input") }}:</p> <table class="standard-table"> <thead> @@ -37,8 +37,8 @@ original_slug: HTML/HTML5/Constraint_validation <td>Значение должно быть абсолютным URL, одним из: <ul> <li>валидным URI (как описано в <a class="external" href="http://www.ietf.org/rfc/rfc3986.txt" title="http://www.ietf.org/rfc/rfc3986.txt">RFC 3986</a>)</li> - <li>валидным IRI, без query сомпонента (как описано в <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li> - <li>валидным IRI, без query сомпонента и без неэкранированных не-ASCII символов (как описано в <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li> + <li>валидным IRI, без query компонента (как описано в <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li> + <li>валидным IRI, без query компонента и без неэкранированных не-ASCII символов (как описано в <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li> <li>валидным IRI, при условии, что кодировка документа UTF-8 или UTF-16 (как описано в <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li> </ul> </td> @@ -53,7 +53,7 @@ original_slug: HTML/HTML5/Constraint_validation <li><code>ldh-str</code> (описан в <a class="external" href="http://www.apps.ietf.org/rfc/rfc1034.html#sec-3.5" title="http://www.apps.ietf.org/rfc/rfc1034.html#sec-3.5">RFC 1034</a>) - US-ASCII символы, цифры и "<span style="font-family: courier new;">-"</span>, сгруппированы по словам и разделённые точкой (<span style="font-family: courier new;">.</span>).</li> </ul> - <div class="note"><strong>Внимание:</strong> если установлен аттрибут {{ htmlattrxref("multiple", "input") }}, в поле могут быть вписаны несколько e-mail адресов, разделённых запятыми. Если любое из этих условий не выполнено, будет вызвано <strong>Type mismatch </strong>constraint violation.</div> + <div class="note"><strong>Внимание:</strong> если установлен атрибут {{ htmlattrxref("multiple", "input") }}, в поле могут быть вписаны несколько e-mail адресов, разделённых запятыми. Если любое из этих условий не выполнено, будет вызвано <strong>Type mismatch </strong>constraint violation.</div> </td> <td><strong>Type mismatch </strong>constraint violation</td> </tr> @@ -62,15 +62,15 @@ original_slug: HTML/HTML5/Constraint_validation <p>Следует учесть, что большинство типов input не имеют "нативных" ограничений, а некоторые из них просто лишены валидации или имеют автоматическую корректировку невалидных значений по умолчанию. </p> -<h3 id="Аттрибуты_валидации">Аттрибуты валидации</h3> +<h3 id="Атрибуты_валидации">Атрибуты валидации</h3> -<p>Ниже перечислены аттрибуты, которые описывают базовые ограничения:</p> +<p>Ниже перечислены атрибуты, которые описывают базовые ограничения:</p> <table class="standard-table"> <thead> <tr> - <th scope="col">Аттрибут</th> - <th scope="col">Типы input с поддержкой аттрибута</th> + <th scope="col">Атрибут</th> + <th scope="col">Типы input с поддержкой атрибута</th> <th scope="col">Возможные значения</th> <th scope="col">Описание ограничения</th> <th scope="col">Связанное нарушение</th> @@ -88,7 +88,7 @@ original_slug: HTML/HTML5/Constraint_validation <td rowspan="3">{{ htmlattrxref("min", "input") }}</td> <td>range, number</td> <td>Валидное число</td> - <td rowspan="3">Значение поля должно быть больше или равно значению аттрибута</td> + <td rowspan="3">Значение поля должно быть больше или равно значению атрибута</td> <td rowspan="3"><strong>Underflow</strong> constraint violation</td> </tr> <tr> @@ -103,7 +103,7 @@ original_slug: HTML/HTML5/Constraint_validation <td rowspan="3">{{ htmlattrxref("max", "input") }}</td> <td>range, number</td> <td>Валидное число</td> - <td rowspan="3">Значение поля должно быть меньше или равно значению аттрибута</td> + <td rowspan="3">Значение поля должно быть меньше или равно значению атрибута</td> <td rowspan="3"><strong>Overflow</strong> constraint violation</td> </tr> <tr> @@ -117,7 +117,7 @@ original_slug: HTML/HTML5/Constraint_validation <tr> <td>{{ htmlattrxref("required", "input") }}</td> <td>text, search, url, tel, email, password, date, datetime, datetime-local, month, week, time, number, checkbox, radio, file; also on the {{ HTMLElement("select") }} and {{ HTMLElement("textarea") }} elements</td> - <td><em>никакое</em> так как это Boolean аттрибут: его присутствие означает <em>true</em>, а отсутствие - <em>false</em></td> + <td><em>никакое</em> так как это Boolean атрибут: его присутствие означает <em>true</em>, а отсутствие - <em>false</em></td> <td>Значение должно быть не пустым (если установлено).</td> <td><strong>Missing</strong> constraint violation</td> </tr> @@ -125,7 +125,7 @@ original_slug: HTML/HTML5/Constraint_validation <td rowspan="5">{{ htmlattrxref("step", "input") }}</td> <td>date</td> <td>Целое число дней</td> - <td rowspan="5">Пока в аттрибут <code>step</code> не установлен <em>любой</em> литерал, значение может быть <strong>min</strong> + любое число, крастное шагу.</td> + <td rowspan="5">Пока в атрибут <code>step</code> не установлен <em>любой</em> литерал, значение может быть <strong>min</strong> + любое число, красное шагу.</td> <td rowspan="5"><strong>Step mismatch </strong>constraint violation</td> </tr> <tr> @@ -148,7 +148,7 @@ original_slug: HTML/HTML5/Constraint_validation <td>{{ htmlattrxref("maxlength", "input") }}</td> <td>text, search, url, tel, email, password; также на элементе {{ HTMLElement("textarea") }}</td> <td>Длина (целое число)</td> - <td>Количество символов (знаков) не должно превышать значение аттрибута.</td> + <td>Количество символов (знаков) не должно превышать значение атрибута.</td> <td><strong>Too long</strong> constraint violation</td> </tr> </tbody> diff --git a/files/ru/web/guide/html/html5/index.html b/files/ru/web/guide/html/html5/index.html index a090f00d95..6583613185 100644 --- a/files/ru/web/guide/html/html5/index.html +++ b/files/ru/web/guide/html/html5/index.html @@ -37,11 +37,11 @@ original_slug: HTML/HTML5 <dt><a href="/ru/docs/HTML/%D0%98%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">Использование HTML5 audio и video</a></dt> <dd>{{ HTMLElement("audio") }} и {{ HTMLElement("video") }} элементы вставляют и позволяют управлять мультимедиа контентом.</dd> <dt><a href="/en-US/docs/HTML/Forms_in_HTML" title="Forms in HTML5">Формы в HTML5</a></dt> - <dd>Взгляд на улучшение форм в HTML5: API валидации, несколько новых атрибутов, новые значения для аттрибута {{ htmlattrxref("type", "input") }} тега {{ HTMLElement("input") }} и новый элемент {{ HTMLElement("output") }}.</dd> + <dd>Взгляд на улучшение форм в HTML5: API валидации, несколько новых атрибутов, новые значения для атрибута {{ htmlattrxref("type", "input") }} тега {{ HTMLElement("input") }} и новый элемент {{ HTMLElement("output") }}.</dd> <dt>Новые семантические элементы</dt> <dd>Кроме секций, медиа и форм, множество новых тегов, такие как {{ HTMLElement("mark") }}, {{ HTMLElement("figure") }}, {{ HTMLElement("figcaption") }}, {{ HTMLElement("data") }}, {{ HTMLElement("time") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }} и {{ HTMLElement("meter") }}, увеличено количество <a href="/en-US/docs/HTML/HTML5/HTML5_element_list" title="/en-US/docs/HTML/HTML5/HTML5_element_list">валидных HTML5 элементов</a>.</dd> <dt>Улучшение {{HTMLElement("iframe")}}</dt> - <dd>Использование атрубутов {{htmlattrxref("sandbox", "iframe")}}, {{htmlattrxref("seamless", "iframe")}}, and {{htmlattrxref("srcdoc", "iframe") }}, разработчики могут задать нужный уровень безопасности и осуществивить рендеринг тега {{HTMLElement("iframe")}}.</dd> + <dd>Использование атрибутов {{htmlattrxref("sandbox", "iframe")}}, {{htmlattrxref("seamless", "iframe")}}, and {{htmlattrxref("srcdoc", "iframe") }}, разработчики могут задать нужный уровень безопасности и осуществить рендеринг тега {{HTMLElement("iframe")}}.</dd> <dt><a href="/en-US/docs/MathML" title="/en-US/docs/MathML">MathML</a></dt> <dd>Позволяет вставлять математические формулы.</dd> <dt><a href="/ru/docs/HTML/HTML5/%D0%92%D0%B2%D0%B5%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5_%D0%B2_HTML5" title="/en-US/docs/HTML/HTML5/Introduction_to_HTML5">Введение в HTML5</a></dt> @@ -59,7 +59,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/Server-sent_events/Using_server-sent_events" title="/en-US/docs/Server-sent_events/Using_server-sent_events">Server-sent события</a></dt> <dd>Позволяет серверу отправлять события клиенту, а не по классической парадигме, где сервер может передавать данные только в ответ на запрос клиента.</dd> <dt><a href="/en-US/docs/WebRTC" title="/en-US/WebRTC">WebRTC</a></dt> - <dd>Эта технология, где RTC создает возможость общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> + <dd>Эта технология, где RTC создает возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> </dl> <h2 id="ОФФЛАЙН_И_ХРАНИЛИЩЕ" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3833/HTML5_Offline_Storage_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">ОФФЛАЙН И ХРАНИЛИЩЕ</h2> @@ -70,7 +70,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Online and offline events</a></dt> <dd>Firefox 3 поддерживает WHATWG online и offline события, которые позволяют приложениям и расширениям обнаружить есть ли активное подключение к Интернет, а также определить, когда соединение портится или улучшается.</dd> <dt><a href="/en-US/docs/DOM/Storage" title="DOM/Storage">WHATWG сессионное или постоянное хранилище (aka DOM Storage)</a></dt> - <dd>Постоянное или сессионое храилище позволяет веб-приложениям хранить структурированны данные на стороне клиента.</dd> + <dd>Постоянное или сессионное хранилище позволяет веб-приложениям хранить структурированные данные на стороне клиента.</dd> <dt><a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a></dt> <dd>Веб-стандарт для хранения значительных количеств структурированных данных в браузере и для быстрого их поиска, используя индексы.</dd> <dt><a href="/en-US/docs/Using_files_from_web_applications" title="Using_files_from_web_applications">Using files from web applications</a></dt> @@ -83,7 +83,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/Using_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">Использование HTML5 audio и video</a></dt> <dd>{{ HTMLElement("audio") }} и {{ HTMLElement("video") }} элементы вставляют и позволяют управлять мультимедиа контентом.</dd> <dt><a href="/en-US/docs/WebRTC" title="/en-US/WebRTC">WebRTC</a></dt> - <dd>Эта технология, где RTC создает возможость общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> + <dd>Эта технология, где RTC создает возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.</dd> <dt><a href="/en-US/docs/DOM/Using_the_Camera_API" title="/en-US/docs/DOM/Using_the_Camera_API">Использование Camera API</a></dt> <dd>Позволяет контролировать, манипулировать и хранить изображения с камеры устройства.</dd> </dl> @@ -96,7 +96,7 @@ original_slug: HTML/HTML5 <dt><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">HTML5 text API для <code><canvas></code></a></dt> <dd>HTML5 text API сейчас поддерживается в {{ HTMLElement("canvas") }}.</dd> <dt><a href="/en-US/docs/WebGL" title="WebGL">WebGL</a></dt> - <dd>WebGL приносит 3D в веб, соответстсвует OpenGL ES 2.0, может использоваться в HTML5 через {{ HTMLElement("canvas") }}.</dd> + <dd>WebGL приносит 3D в веб, соответствует OpenGL ES 2.0, может использоваться в HTML5 через {{ HTMLElement("canvas") }}.</dd> <dt><a href="/en-US/docs/SVG" title="/en-US/docs/SVG">SVG</a></dt> <dd>Основанный на XML формат векторных изображений, который может быть непосредственно вставлен в HTML.</dd> </dl> @@ -162,7 +162,7 @@ original_slug: HTML/HTML5 <dt>Анимируйте свой стиль</dt> <dd>Используйте <a href="/en-US/docs/CSS/Using_CSS_transitions" title="/en-US/docs/CSS/Using_CSS_transitions">CSS Переходы</a>, чтобы анимировать изменение состояния элемента или <a href="/en-US/docs/CSS/Using_CSS_animations" title="/en-US/docs/CSS/Using_CSS_animations">CSS Анимации</a> для анимации частей страницы без запуска событий, вы теперь можете контролировать мобильные элементы на вашей странице.</dd> <dt>Улучшение типографии</dt> - <dd>Авторы могут лучше контролировать типографию. Например, они могут контролировать {{ cssxref("text-overflow") }} и <a href="/en-US/docs/CSS/hyphens" title="/en-US/docs/CSS/hyphens">перенос слов</a>, а также <a href="/en-US/docs/CSS/text-shadow" title="/en-US/docs/CSS/text-shadow">тень текста</a> и его <a href="/en-US/docs/CSS/text-decoration" title="/en-US/docs/SVG/Attribute/text-decoration">декорированиe</a>. Могут загрузить и применить другой шрифт правилом {{ cssxref("@font-face") }}.</dd> + <dd>Авторы могут лучше контролировать типографию. Например, они могут контролировать {{ cssxref("text-overflow") }} и <a href="/en-US/docs/CSS/hyphens" title="/en-US/docs/CSS/hyphens">перенос слов</a>, а также <a href="/en-US/docs/CSS/text-shadow" title="/en-US/docs/CSS/text-shadow">тень текста</a> и его <a href="/en-US/docs/CSS/text-decoration" title="/en-US/docs/SVG/Attribute/text-decoration">декорирование</a>. Могут загрузить и применить другой шрифт правилом {{ cssxref("@font-face") }}.</dd> <dt>Новые презентационные макеты</dt> <dd>Для того, чтобы улучшить гибкость дизайна, добавили: <a href="/en-US/docs/CSS/Using_CSS_multi-column_layouts" title="/en-US/docs/CSS/Using_CSS_multi-column_layouts">CSS мульти-колоночный макет</a> и <a href="/en-US/docs/CSS/Flexbox" title="/en-US/docs/CSS/Flexbox">CSS отзывчивый блочный макет</a>.</dd> </dl> diff --git a/files/ru/web/guide/html/using_html_sections_and_outlines/index.html b/files/ru/web/guide/html/using_html_sections_and_outlines/index.html index 5bd0fa3f9d..57fc57b89d 100644 --- a/files/ru/web/guide/html/using_html_sections_and_outlines/index.html +++ b/files/ru/web/guide/html/using_html_sections_and_outlines/index.html @@ -341,7 +341,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document </script> <![endif]--></pre> -<p>Этот скрипт запускается в Internet Explorer (8 и более ранней версии), однако требует включенной поддержки скриптов для правильного отображения элементов задания разделов и заголовок HTML5. Если поддержа скриптов выключена, это может стать проблемой, поскольку данные элементы, скорее всего, определяют структуру всей страницы. Поэтому необходимо добавить элемент {{HTMLElement("noscript")}}:</p> +<p>Этот скрипт запускается в Internet Explorer (8 и более ранней версии), однако требует включенной поддержки скриптов для правильного отображения элементов задания разделов и заголовок HTML5. Если поддержка скриптов выключена, это может стать проблемой, поскольку данные элементы, скорее всего, определяют структуру всей страницы. Поэтому необходимо добавить элемент {{HTMLElement("noscript")}}:</p> <pre class="brush:xml notranslate"><noscript> <strong>Внимание!</strong> diff --git a/files/ru/web/guide/mobile/index.html b/files/ru/web/guide/mobile/index.html index e7eb95c172..23d971b083 100644 --- a/files/ru/web/guide/mobile/index.html +++ b/files/ru/web/guide/mobile/index.html @@ -53,7 +53,7 @@ translation_of: Web/Guide/Mobile <li>Для браузеров, которые не поддерживают эти свойства, обеспечьте приемлемый упрощенный вариант.</li> </ul> -<p>Например, если вы указываете градиент в качестве фона для какого-либо текста, используя стиль с вендорным префиксом типа <code>-webkit-linear-gradient</code>, правильнее включить другие варианты с вендор-специфичекими префиксами для свойства <a href="/en/CSS/linear-gradient" title="en/CSS/linear-gradient">linear-gradient</a>. Если вы этого не делаете, по крайней мере удостоверьтесь, что фон, отображаемый по умолчанию, контрастирует с текстом: тогда страница, по крайней мере, будет корректно отображаться в браузере, который не воспринимает ваше <code>linear-gradient</code> правило.</p> +<p>Например, если вы указываете градиент в качестве фона для какого-либо текста, используя стиль с вендорным префиксом типа <code>-webkit-linear-gradient</code>, правильнее включить другие варианты с вендор-специфическими префиксами для свойства <a href="/en/CSS/linear-gradient" title="en/CSS/linear-gradient">linear-gradient</a>. Если вы этого не делаете, по крайней мере удостоверьтесь, что фон, отображаемый по умолчанию, контрастирует с текстом: тогда страница, по крайней мере, будет корректно отображаться в браузере, который не воспринимает ваше <code>linear-gradient</code> правило.</p> <p>Смотрите этот <a href="/en/CSS/CSS_Reference/Mozilla_Extensions" title="en/CSS/CSS_Reference/Mozilla_Extensions">список Gecko-специфических свойств</a>, и этот список <a href="/en/CSS/CSS_Reference/Webkit_Extensions" title="en/CSS/CSS_Reference/Webkit_Extensions">WebKit-</a><a href="/en/CSS/CSS_Reference/Mozilla_Extensions" title="en/CSS/CSS_Reference/Mozilla_Extensions">специфических свойств</a>, и <a class="external" href="http://peter.sh/experiments/vendor-prefixed-css-property-overview/">таблицу вендор-специфических свойств</a> от Peter Beverloo.</p> @@ -61,7 +61,7 @@ translation_of: Web/Guide/Mobile <h3 id="Позаботьтесь_об_анализе_user_agent">Позаботьтесь об анализе user agent</h3> -<p>Для веб-сайтов предпочтительнее обнаружить свойства, специфичные для устройства, такие как размеры экрана и наличие сенсорного экрана, используя описанные выше способы, и соответсвенно адаптироваться. Но иногда это непрактично, и веб-сайты прибегают к синтаксическому разбору строки user agent браузера чтобы различить десктопы, планшеты, и смартфоны, чтобы отправлять разный контент под каждый тип устройств.</p> +<p>Для веб-сайтов предпочтительнее обнаружить свойства, специфичные для устройства, такие как размеры экрана и наличие сенсорного экрана, используя описанные выше способы, и соответственно адаптироваться. Но иногда это непрактично, и веб-сайты прибегают к синтаксическому разбору строки user agent браузера чтобы различить десктопы, планшеты, и смартфоны, чтобы отправлять разный контент под каждый тип устройств.</p> <p>Если вы это делаете, удостоверьтесь что ваш алгоритм точный, и вы не отправляете неверный тип контента на устройство из-за того что вы не знаете какой-то специфической для браузера user agent строки. Смотрите данное <a href="/en/Browser_detection_using_the_user_agent#Mobile.2C_Tablet_or_Desktop" title="browser detection using the user agent">руководство по использованию user agent строки чтобы определить тип устройства</a>.</p> @@ -71,5 +71,5 @@ translation_of: Web/Guide/Mobile <ul> <li>тестируйте под мобильный Safari на iPhone используя <a class="link-https" href="https://developer.apple.com/devcenter/ios/index.action">iOS симулятор</a></li> - <li>тестируйте под Opera и Firefox используя <a class="link-https" href="https://developer.android.com/sdk/index.html">Android SDK</a>. Смотрите эти дополнительные интсрукции для <a class="link-https" href="https://wiki.mozilla.org/Mobile/Fennec/Android/Emulator">запуска Firefox под Android используя эмулятор Android</a>.</li> + <li>тестируйте под Opera и Firefox используя <a class="link-https" href="https://developer.android.com/sdk/index.html">Android SDK</a>. Смотрите эти дополнительные инструкции для <a class="link-https" href="https://wiki.mozilla.org/Mobile/Fennec/Android/Emulator">запуска Firefox под Android используя эмулятор Android</a>.</li> </ul> diff --git a/files/ru/web/guide/user_input_methods/index.html b/files/ru/web/guide/user_input_methods/index.html index 9204a6fb1a..945fbc3269 100644 --- a/files/ru/web/guide/user_input_methods/index.html +++ b/files/ru/web/guide/user_input_methods/index.html @@ -179,7 +179,7 @@ if (elem.requestFullscreen) { <li><a href="/ru/docs/Web/API/CSS_Object_Model/ориентация_экрана">Разбираемся с ориентацией экрана</a></li> <li><a href="/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode">Использование полноэкранного режима</a></li> <li><a href="/en-US/docs/Web/Guide/HTML/Dragging_and_Dropping_Multiple_Items">Перетаскивание и сброс нескольких объектов</a></li> - <li><a href="/ru/docs/Web/Guide/HTML/Drag_and_drop/Drag_operations">Руководство по перетаскиваниям</a></li> + <li><a href="/ru/docs/Web/Guide/HTML/Drag_and_drop/Drag_operations">Руководство по перетаскиванием</a></li> </ul> <h2 id="См._также">См. также</h2> |