diff options
| author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
|---|---|---|
| committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
| commit | 074785cea106179cb3305637055ab0a009ca74f2 (patch) | |
| tree | e6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/ru/web/html/global_attributes | |
| parent | da78a9e329e272dedb2400b79a3bdeebff387d47 (diff) | |
| download | translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2 translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip | |
initial commit
Diffstat (limited to 'files/ru/web/html/global_attributes')
| -rw-r--r-- | files/ru/web/html/global_attributes/accesskey/index.html | 134 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/class/index.html | 58 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/contenteditable/index.html | 112 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/data-_star_/index.html | 81 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/dir/index.html | 88 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/dropzone/index.html | 43 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/id/index.html | 69 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/index.html | 156 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/inputmode/index.html | 60 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/is/index.html | 62 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/itemid/index.html | 106 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/lang/index.html | 90 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/style/index.html | 111 | ||||
| -rw-r--r-- | files/ru/web/html/global_attributes/tabindex/index.html | 112 |
14 files changed, 1282 insertions, 0 deletions
diff --git a/files/ru/web/html/global_attributes/accesskey/index.html b/files/ru/web/html/global_attributes/accesskey/index.html new file mode 100644 index 0000000000..209d8b95e5 --- /dev/null +++ b/files/ru/web/html/global_attributes/accesskey/index.html @@ -0,0 +1,134 @@ +--- +title: accesskey +slug: Web/HTML/Global_attributes/accesskey +tags: + - HTML + - Reference +translation_of: Web/HTML/Global_attributes/accesskey +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <strong>accesskey </strong>дает возможность быстро перейти к элементу с помощью комбинации клавиш. Значение атрибута состоит из одного печатного символа (в том числе спец. символы, акценты и другие, которые можно написать с клавиатуры).</p> + +<div>{{EmbedInteractiveExample("pages/tabbed/attribute-accesskey.html","tabbed-shorter")}}</div> + +<div class="note"> +<p><strong>Замечание</strong>: Спецификация WHATWG допускает использования нескольких символов разделённых пробелом. Однако, на момент написания, эта функциональность не поддерживается в современных браузерах. IE и Edge в таком случае будет использовать первый символ, игнорируя остальные.</p> +</div> + +<p>Активация элементов с помощью Accesskey зависит от браузера и платформы:</p> + +<table class="standard-table"> + <tbody> + <tr> + <th> </th> + <th>Windows</th> + <th>Linux</th> + <th>macOS</th> + </tr> + <tr> + <th>Firefox</th> + <td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd>+ <kbd>Shift</kbd>+<kbd><em>key</em></kbd></td> + <td>В Firefox 57 и новее: <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd><em>key</em></kbd> -OR- <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br> + В Firefox 14 и новее: <kbd>Control</kbd>+ <kbd>Alt</kbd>+ <kbd><em>key</em></kbd><br> + В Firefox 13 и старше, <kbd>Control</kbd>+<kbd><em>key</em></kbd></td> + </tr> + <tr> + <th>Internet Explorer</th> + <td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td> + <td colspan="2" rowspan="1">N / A</td> + </tr> + <tr> + <th>Google Chrome</th> + <td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td> + <td><kbd>Control</kbd>+ <kbd>Alt</kbd>+<kbd><em>key</em></kbd></td> + </tr> + <tr> + <th>Safari</th> + <td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td> + <td>N / A</td> + <td><kbd>Control</kbd>+ <kbd>Alt</kbd>+<kbd><em>key</em></kbd></td> + </tr> + <tr> + <th>Opera 15+</th> + <td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td> + <td><kbd>Control</kbd>+ <kbd>Alt</kbd>+<kbd><em>key</em></kbd></td> + </tr> + <tr> + <th>Opera 12</th> + <td colspan="3" rowspan="1"><kbd>Shift</kbd>+ <kbd>Esc</kbd> показывает список элементов, доступных для быстрого перехода. Перейти на нужный элемент можно нажав соответствующий символ (<kbd><em>key</em></kbd>)</td> + </tr> + <tr> + </tr> + </tbody> +</table> + +<p>Обратите внимание, что в Firefox пользоватеть может настроить свой модификатор активации.</p> + +<h2 id="Проблемы_с_доступностью">Проблемы с доступностью</h2> + +<p>В добавок к слабой поддержке браузерами всех возможностей в спецификации, у атрибута <code>accesskey</code> есть проблемы с доступностью:</p> + +<ul> + <li>Значение атрибута <code>accesskey</code> может конфликтовать с комбинациями клавиш системы, браузера или вспомогательными инструментами доступности.</li> + <li>Определённые значения атрибута <code>accesskey</code> могут отсутствовать на некоторых клавиатурах. Это особенно сильно проявляется, если вы используете язык отличный от английского.</li> + <li>Числовые значения атрибута могут <code>accesskey</code> затруднить работу с сайтом для людей с растройствами мышления. Например, когда числовые значения не имеют логической связи со связанным элементом.</li> + <li>Не существует стандартизированного способа информировать пользователя о наличии атрибута <code>accesskey</code> на элементе. Неинформированный пользователь может случайно активировать элемент с атрибутом <code>accesskey</code>.</li> +</ul> + +<p>Ввиду этих причин рекомендуется не использовать атрибут <code>accesskey</code> для обычных сайтов и веб-приложений.</p> + +<ul> + <li><a href="https://webaim.org/techniques/keyboard/accesskey#spec">WebAIM: Keyboard Accessibility - Accesskey</a></li> +</ul> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Положение дел</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('HTML5.2', "editing.html#the-accesskey-attribute", "accesskey")}}</td> + <td>{{Spec2('HTML5.2')}}</td> + <td>Более приближённое к действительности описание поведения.</td> + </tr> + <tr> + </tr> + <tr> + <td>{{SpecName ( 'HTML WHATWG', "interaction.html#the-accesskey-attribute", "Accesskey")}}</td> + <td>{{Spec2 ( 'HTML WHATWG')}}</td> + <td>Никаких изменений с последнего снимка, {{SpecName ( 'HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName ( 'HTML5.1', "editing.html#the-accesskey-attribute", "Accesskey")}}</td> + <td>{{Spec2 ( 'HTML5.1')}}</td> + <td>Снимок {{SpecName ( 'HTML WHATWG')}}, без изменений от {{SpecName ( 'W3C HTML5')}}</td> + </tr> + <tr> + <td>{{SpecName ( 'HTML5 W3C', "editing.html#the-accesskey-attribute", "Accesskey")}}</td> + <td>{{Spec2 ( 'W3C HTML5')}}</td> + <td>Снимок {{SpecName ( 'HTML WHATWG')}}. Из {{SpecName ( 'HTML4.01')}}, несколько символов могут быть установлены как <code>accesskey</code>. Кроме того , он может быть установлен на любом элементе.</td> + </tr> + <tr> + <td>{{SpecName ( 'HTML4.01', "interact/forms.html#h-17.11.2", "Accesskey")}}</td> + <td>{{Spec2 ( 'HTML4.01')}}</td> + <td>Поддерживается только {{HTMLElement ( "а")}}, {{HTMLElement ( "Площадь")}}, {{HTMLElement ( "кнопка")}}, {{HTMLElement ( "вход")}}, {{HTMLElement ( "метка")}}, {{HTMLElement ( "легенда")}} и {{HTMLElement ( "текстовое поле")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<p>{{Compat("html.global_attributes.accesskey")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>{{domxref("Element.accessKey")}}</li> + <li>{{domxref("HTMLElement.accessKeyLabel")}}</li> + <li>Все <a href="/en-US/docs/Web/HTML/Global_attributes">глобальные атрибуты</a> .</li> +</ul> diff --git a/files/ru/web/html/global_attributes/class/index.html b/files/ru/web/html/global_attributes/class/index.html new file mode 100644 index 0000000000..644e281562 --- /dev/null +++ b/files/ru/web/html/global_attributes/class/index.html @@ -0,0 +1,58 @@ +--- +title: class +slug: Web/HTML/Global_attributes/class +translation_of: Web/HTML/Global_attributes/class +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><span class="seoSummary"><a href="/ru/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code><strong>class</strong></code> это разделенный пробелом список регистро зависимых классов элемента. Классы позволяют CSS и Javascript выбирать и получать доступ с помощью <a href="/ru/docs/Web/CSS/Class_selectors">селекторов класса</a> или функций, таких как методы DOM {{domxref("document.getElementsByClassName")}}.</span></p> + +<div>{{EmbedInteractiveExample("pages/tabbed/attribute-class.html","tabbed-standard")}}</div> + +<div class="hidden">Исходный код этого примера хранится на GitHub. Если вы хотели бы поспособствовать интерактивными примерами, пожалуйста склонируйете <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> и отправьте pull request.</div> + +<p>Хотя спецификация не предъявляет требований к именам классов, веб-разработчикам рекомендуется использовать имена, описывающие семантическое назначение элемента, а не представление элемента. Например, <em>атрибут</em> описывает атрибут, а не <em>курсив</em>, хотя элемент этого класса может быть представлен <em>курсивом</em>. Семантические имена остаются логичными даже при изменении представления страницы.</p> + +<h2 id="Спецификация">Спецификация</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "elements.html#classes", "class")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Нет изменений c последнего снимка, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "elements.html#classes", "class")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Снимок {{SpecName('HTML WHATWG')}}, никаких изменений от {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "elements.html#classes", "class")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Снимок {{SpecName('HTML WHATWG')}}. Начиная с {{SpecName('HTML4.01')}}, <code>class</code> теперь это истинный глобальный атрибут.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', "struct/global.html#h-7.5.2", "class")}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Поддерживается на всех элементах, кроме {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, и {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + + + +<p>{{Compat("html.global_attributes.class")}}</p> + +<h2 id="Смотреть_также">Смотреть также</h2> + +<ul> + <li>Все <a href="/ru/docs/Web/HTML/Global_attributes">глобальные атрибуты</a>.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/contenteditable/index.html b/files/ru/web/html/global_attributes/contenteditable/index.html new file mode 100644 index 0000000000..638ea9c94a --- /dev/null +++ b/files/ru/web/html/global_attributes/contenteditable/index.html @@ -0,0 +1,112 @@ +--- +title: contenteditable +slug: Web/HTML/Global_attributes/contenteditable +tags: + - HTML + - Глобальные атрибуты + - Определение +translation_of: Web/HTML/Global_attributes/contenteditable +--- +<p>{{HTMLSidebar("Global_attributes")}}</p> + +<p><font> (Mozilla / 5.0 (Windows NT 6.3, WOW64; rv: 29.0) Gecko / 20100101 Firefox / 29.0) </font><br> + Атрибут <code><strong>contenteditable</strong></code> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">global attribute</a> - это перечисляемый атрибут, указывающий, должен ли элемент редактироваться пользователем. Если это так, браузер изменит свой виджет, чтобы разрешить редактирование. Атрибут должен принимать одно из следующих значений:</p> + +<ul> + <li><span style="font-family: courier new;">true</span> или <em>пустую строку</em>, которое показывает, что элемент должен быть редактируемым;</li> + <li><span style="font-family: courier new;">false</span>, которое показывает, что элемент должен быть нередактируемым.</li> +</ul> + +<p>Если атрибут не указан, то его значение <em>наследуется</em> от своего родительского элемента.</p> + +<p>Этот атрибут <em>принимает одно из определенных значений</em> и не является <em>булевским</em>. Это значит, что точное использование одного из значений <code>true, false</code> или пустая строка обязательно и такое сокращение, как <code><label contenteditable>Пример метки</label> </code>неразрешено. Верное использование — <code><label contenteditable="true">Пример метки</label></code>. </p> + +<p>Вы можете установить цвет, используемый для вставки текста {{Glossary("caret")}}<br> + со свойством CSS {{cssxref("caret-color")}}. </p> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "editing.html#attr-contenteditable", "contenteditable")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Нет изменений с последней версии {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#attr-contenteditable", "contenteditable")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Копия {{SpecName('HTML WHATWG')}}, нет изменений от {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "editing.html#attr-contenteditable", "contenteditable")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Копия {{SpecName('HTML WHATWG')}}, первоначальное определение.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость">Совместимость</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Основная поддержка</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoDesktop("1.9") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Основная поддержка</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatGeckoMobile("1.9") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li><a href="/ru/docs/Web/Guide/HTML/Editable_content">Создание контента для редактирования</a></li> + <li>Все <a href="/ru/docs/Web/HTML/Общие_атрибуты">глобальные атрибуты</a></li> + <li>{{domxref("HTMLElement.contentEditable")}} и {{domxref("HTMLElement.isContentEditable")}}</li> +</ul> diff --git a/files/ru/web/html/global_attributes/data-_star_/index.html b/files/ru/web/html/global_attributes/data-_star_/index.html new file mode 100644 index 0000000000..df80ab58ae --- /dev/null +++ b/files/ru/web/html/global_attributes/data-_star_/index.html @@ -0,0 +1,81 @@ +--- +title: data-* +slug: Web/HTML/Global_attributes/data-* +translation_of: Web/HTML/Global_attributes/data-* +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p>The <strong>data-*</strong> Глобальные атрибуты образуют класс атрибутов, называемых пользовательскими атрибутами данных, которые позволяют обмениваться проприетарной информацией между HTML и его представлением DOM посредством сценариев.</p> + +<div>{{EmbedInteractiveExample("pages/tabbed/attribute-data.html","tabbed-standard")}}</div> + +<div class="hidden">Исходный код этого интерактивного примера хранится в репозитории GitHub. Если вы хотите внести свой вклад в проект интерактивных примеров, пожалуйста, клонируйте https://github.com/mdn/interactive-examples и отправьте нам запрос на извлечение.</div> + +<p>Все такие пользовательские данные доступны через интерфейс {{domxref ("HTMLElement")}} элемента, для которого установлен атрибут. Свойство {{domxref ("HTMLElement.dataset")}} предоставляет к ним доступ.<br> + Символ * может быть заменен любым именем, соответствующим производственному правилу имен xml, со следующими ограничениями:</p> + +<ul> + <li>имя не должно начинаться с xml, в любом случае для этих букв используется регистр;</li> + <li>имя не должно содержать точку с запятой (U + 003A);</li> + <li>имя не должно содержать заглавных букв.</li> +</ul> + +<p>Обратите внимание, что свойство {{domxref ("HTMLElement.dataset")}} является {{domxref ("DOMStringMap")}}, и имя настраиваемого атрибута данных data-test-value будет доступно через HTMLElement.dataset. testValue (или HTMLElement.dataset ["testValue"]), поскольку любая тире (U + 002D) заменяется заглавной буквой следующей буквы, преобразуя имя в camelcase.</p> + + + +<h3 id="Использование">Использование</h3> + +<p>Добавляя атрибуты data- *, даже обычные элементы HTML могут стать довольно сложными и мощными программными объектами. Например, «спрайт» космического корабля в игре может быть простым элементом {{HTMLElement ("img")}} с атрибутом класса и несколькими атрибутами data- *:</p> + +<pre><img class="spaceship cruiserX3" src="shipX3.png" + data-ship-id="324" data-weapons="laserI laserII" data-shields="72%" + data-x="414354" data-y="85160" data-z="31940" + onclick="spaceships[this.dataset.shipId].blasted()"> +</img> +</pre> + +<p>Более подробное руководство по использованию атрибутов данных HTML см. В разделе <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes</a>.</p> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>No change from latest snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}, initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div> + +<p>{{Compat("html.global_attributes.data_attributes")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>All <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</li> + <li>The {{domxref("HTMLElement.dataset")}} property that allows to access and modify these values.</li> + <li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes</a></li> +</ul> diff --git a/files/ru/web/html/global_attributes/dir/index.html b/files/ru/web/html/global_attributes/dir/index.html new file mode 100644 index 0000000000..52a0b158ef --- /dev/null +++ b/files/ru/web/html/global_attributes/dir/index.html @@ -0,0 +1,88 @@ +--- +title: dir +slug: Web/HTML/Global_attributes/dir +translation_of: Web/HTML/Global_attributes/dir +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p>The <code><strong>dir</strong></code> <a href="/en-US/docs/Web/HTML/Global_attributes">global attribute</a> is an enumerated attribute that indicates the directionality of the element's text.</p> + +<div>{{EmbedInteractiveExample("pages/tabbed/attribute-dir.html","tabbed-standard")}}</div> + +<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> + +<p>Он может иметь следующие значения:</p> + +<ul> + <li><code>ltr</code>, which means <em>left to right </em>and is to be used for languages that are written from the left to the right (like English);</li> + <li><code>rtl</code>, which means <em>right to left</em> and is to be used for languages that are written from the right to the left (like Arabic);</li> + <li><code>auto</code>, which lets the user agent decide. It uses a basic algorithm as it parses the characters inside the element until it finds a character with a strong directionality, then applies that directionality to the whole element.</li> +</ul> + +<div class="note"> +<p><strong>Usage notes:</strong> This attribute is mandatory for the {{ HTMLElement("bdo") }} element where it has a different semantic meaning.</p> + +<ul> + <li> + <p>This attribute is <em>not</em> inherited by the {{ HTMLElement("bdi") }} element. If not set, its value is <code>auto</code>.</p> + </li> + <li> + <p>This attribute can be overridden by the CSS properties {{ cssxref("direction") }} and {{ cssxref("unicode-bidi") }}, if a CSS page is active and the element supports these properties.</p> + </li> + <li> + <p>As the directionality of the text is semantically related to its content and not to its presentation, it is recommended that web developers use this attribute instead of the related CSS properties when possible. That way, the text will display correctly even on a browser that doesn't support CSS or has the CSS deactivated.</p> + </li> + <li> + <p>The <code>auto</code> value should be used for data with an unknown directionality, like data coming from user input, eventually stored in a database.</p> + </li> +</ul> +</div> + +<div class="note"> +<p>Browsers might allow users to change the directionality of {{ HTMLElement("input") }} and {{ HTMLElement("textarea") }}s in order to assist with authoring content. Chrome and Safari provide a directionality option in the contextual menu of input fields while Internet Explorer and Edge use the key combinations <kbd>Ctrl</kbd> + <kbd>Left Shift</kbd> and <kbd>Ctrl</kbd> + <kbd>Right Shift</kbd>. Firefox uses <kbd>Ctrl</kbd>/<kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>X</kbd> but does NOT update the <code><strong>dir</strong></code> attribute value.</p> +</div> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-dir-attribute", "dir")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>No change from latest snapshot, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-dir-attribute", "dir")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-dir-attribute", "dir")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}, from {{SpecName('HTML4.01')}} it added the <code>auto</code> value, and is now a true global attribute.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', "dirlang.html#h-8.2", "dir")}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Supported on all elements but {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, and {{HTMLElement("script")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("html.global_attributes.dir")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>All <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</li> + <li>{{domxref("HTMLElement.dir")}} that reflects this attribute.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/dropzone/index.html b/files/ru/web/html/global_attributes/dropzone/index.html new file mode 100644 index 0000000000..19c7d5d01b --- /dev/null +++ b/files/ru/web/html/global_attributes/dropzone/index.html @@ -0,0 +1,43 @@ +--- +title: dropzone +slug: Web/HTML/Global_attributes/dropzone +translation_of: Web/HTML/Global_attributes/dropzone +--- +<p>{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p> + +<p><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code>dropzone</code> является перечисляемым атрбутом, указывающем, какие типы содержимого могут быть опущены в элементе, используя {{domxref("HTML_Drag_and_Drop_API","HTML Drag and Drop API")}}. Может иметь следующие значения:</p> + +<ul> + <li><code>copy</code>, которая указывает что сброс создает копию перетаскиваемого элемента.</li> + <li><code>move</code>, которое указывает, что перетаскиваемы элемент будет перемещен в новое местоположение.</li> + <li><code>link</code>, которая создает ссылку на перетаскивамые данные.</li> +</ul> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#the-dropzone-attribute", "dropzone")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Снимок {{SpecName('HTML WHATWG')}}, начальное определение</td> + </tr> + </tbody> +</table> + +<h2 id="Поддержка_браузерами">Поддержка браузерами</h2> + +<div class="hidden">Таблица совместимости на этой странице генерируется из структурированных данных. Если вы хотите внести свой вклад в эти данные, просмотрите <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос на извлечение.</div> + +<p>{{Compat("html.global_attributes.dropzone")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>Все <a href="/en-US/docs/Web/HTML/Global_attributes">глобальные атрибуты</a>.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/id/index.html b/files/ru/web/html/global_attributes/id/index.html new file mode 100644 index 0000000000..273036614b --- /dev/null +++ b/files/ru/web/html/global_attributes/id/index.html @@ -0,0 +1,69 @@ +--- +title: id +slug: Web/HTML/Global_attributes/id +tags: + - HTML + - Глобальные атрибуты + - Справка +translation_of: Web/HTML/Global_attributes/id +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><span class="seoSummary"><strong>{{glossary("global attribute", "Глобальный атрибут")}} <code>id</code></strong> устанавливает элементу уникальный идентификатор (ID), имя которого должно быть уникальным в документе (на странице). Его назначением является идентификация элемента при связывании (использование <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web#Fragment">идентификатора фрагмента</a>), скриптинге или стилизации (с помощью {{glossary("CSS")}}).</span></p> + +<div>{{EmbedInteractiveExample("pages/tabbed/attribute-id.html","tabbed-shorter")}}</div> + +<p class="hidden">Исходный код этого интерактивного примера хранится в репозитории GitHub. Если вы хотите внести свой вклад в проект интерактивных примеров, пожалуйста клонируйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> и отправте нам "pull request" (предложение изменения кода в чужом репозитории).</p> + +<p>Значение этого атрибута "непрозрачная" строка: это означает, что веб-автор не должен использовать его для передачи какой-либо информации. Особое значение, например семантическое, получать из этой строки не надо.</p> + +<p>Значение <code>id</code> не должно содержать пропусков (пробелов, табуляции и т.д). Браузеры обрабатывают пробелы, как часть уникального идентификатора. В отличии от атрибута {{htmlattrxref("class")}}, который позволяет разделять пробелами значение (указывать несколько классов через пробел), элементы могут иметь только один ID.</p> + +<div class="note"> +<p><strong>Заметка:</strong> Использование символов отличных от {{glossary("ASCII")}} букв, цифр, <code>'_'</code>, <code>'-'</code> и <code>'.'</code> может вызвать проблемы, связанные с совместимостью, т.к. они не были разрешены в HTML 4. Несмотря на то, что в {{glossary("HTML5")}} ограничение было снято, для совместимости ID должен начинаться с латинской буквы.</p> +</div> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-id-attribute", "id")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Нет изменений с последнего "snapshot" (состояние сохраненное в определенный момент времени), {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-id-attribute", "id")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>"Snapshot" от {{SpecName('HTML WHATWG')}}, нет изменений с {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-id-attribute", "id")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>"Snapshot" от {{SpecName('HTML WHATWG')}}, допускает использование <code>'_'</code>, <code>'-'</code> и <code>'.'</code>, если они не в начале id. Также атрибут стал глобальным.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/global.html#adef-id', 'id')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Поддерживается всеми элементами, кроме {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, и {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Поддержка_браузерами">Поддержка браузерами</h2> + +<div class="hidden">Таблица совместимости на этой странице генерируется из структурированных данных. Если вы хотите внести свой вклад в эти данные, пожалуйста проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам "pull request" (предложение изменения кода в чужом репозитории).</div> + +<p>{{Compat("html.global_attributes.id")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>Все <a href="/ru/docs/Web/HTML/Общие_атрибуты">глобальные атрибуты</a>.</li> + <li>{{domxref("Element.id")}} отражает этот атрибут.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/index.html b/files/ru/web/html/global_attributes/index.html new file mode 100644 index 0000000000..3e61730d7c --- /dev/null +++ b/files/ru/web/html/global_attributes/index.html @@ -0,0 +1,156 @@ +--- +title: Глобальные атрибуты +slug: Web/HTML/Global_attributes +translation_of: Web/HTML/Global_attributes +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<div class="summary"> +<p><strong>Глобальные атрибуты </strong>—<strong> это атрибуты общие для всех HTML элементов</strong>; они могут использоваться всеми элементами, хотя на некоторые элементы могут не оказывать влияния.</p> +</div> + +<p>Глобальные атрибуты могут быть указаны для любых <a href="/ru/docs/Web/HTML/Element">элементов HTML</a>, <em>даже для тех, которые не указаны в стандарте.</em> Это значит, что все нестандартные элементы должны допускать эти атрибуты, даже если использование этих элементов означает, что документ больше не является HTML5-совместимым. Например, HTML5-совместимые бразузеры скрывают содержимое, помеченное как <code><foo hidden>...<foo></code><code>, хотя </code><code><foo></code> не является верным HTML элементом.</p> + +<p>В дополнение к <em>основным </em>для HTML глобальным атрибутам, также существуют следующие глобальные атрибуты:</p> + +<ul> + <li><strong><code>xml:lang</code></strong> и <code><strong>xml:base</strong></code> — унаследованы от спецификации XHTML, и хотя являются устаревшими, сохранены в целях совместимости.</li> + <li>Многочисленные <code><strong><a href="/ru/docs/Web/Accessibility/ARIA">aria-*</a></strong></code> атрибуты, используемые для улучшения доступности.</li> + <li>Атрибуты обработчиков событий: <code><strong>onabort</strong></code>, <code><strong>onautocomplete</strong></code>, <code><strong>onautocompleteerror</strong></code>, <code><strong>onblur</strong></code>, <code><strong>oncancel</strong></code>, <code><strong>oncanplay</strong></code>, <code><strong>oncanplaythrough</strong></code>, <code><strong>onchange</strong></code>, <code><strong>onclick</strong></code>, <code><strong>onclose</strong></code>, <code><strong>oncontextmenu</strong></code>, <code><strong>oncuechange</strong></code>, <code><strong>ondblclick</strong></code>, <code><strong>ondrag</strong></code>, <code><strong>ondragend</strong></code>, <code><strong>ondragenter</strong></code>, <code><strong>ondragexit</strong></code>, <code><strong>ondragleave</strong></code>, <code><strong>ondragover</strong></code>, <code><strong>ondragstart</strong></code>, <code><strong>ondrop</strong></code>, <code><strong>ondurationchange</strong></code>, <code><strong>onemptied</strong></code>, <code><strong>onended</strong></code>, <code><strong>onerror</strong></code>, <code><strong>onfocus</strong></code>, <code><strong>oninput</strong></code>, <code><strong>oninvalid</strong></code>, <code><strong>onkeydown</strong></code>, <code><strong>onkeypress</strong></code>, <code><strong>onkeyup</strong></code>, <code><strong>onload</strong></code>, <code><strong>onloadeddata</strong></code>, <code><strong>onloadedmetadata</strong></code>, <code><strong>onloadstart</strong></code>, <code><strong>onmousedown</strong></code>, <code><strong>onmouseenter</strong></code>, <code><strong>onmouseleave</strong></code>, <code><strong>onmousemove</strong></code>, <code><strong>onmouseout</strong></code>, <code><strong>onmouseover</strong></code>, <code><strong>onmouseup</strong></code>, <code><strong>onmousewheel</strong></code>, <code><strong>onpause</strong></code>, <code><strong>onplay</strong></code>, <code><strong>onplaying</strong></code>, <code><strong>onprogress</strong></code>, <code><strong>onratechange</strong></code>, <code><strong>onreset</strong></code>, <code><strong>onresize</strong></code>, <code><strong>onscroll</strong></code>, <code><strong>onseeked</strong></code>, <code><strong>onseeking</strong></code>, <code><strong>onselect</strong></code>, <code><strong>onshow</strong></code>, <code><strong>onsort</strong></code>, <code><strong>onstalled</strong></code>, <code><strong>onsubmit</strong></code>, <code><strong>onsuspend</strong></code>, <code><strong>ontimeupdate</strong></code>, <code><strong>ontoggle</strong></code>, <code><strong>onvolumechange</strong></code>, <code><strong>onwaiting</strong></code>.</li> +</ul> + +<h2 id="Описание">Описание</h2> + +<dl> + <dt id="attr-accesskey"><code><a href="/ru/docs/Web/HTML/Global_attributes/accesskey">accesskey</a></code></dt> + <dd>Дает подсказку для создания комбинации клавиш для текущего элемента. Этот атрибут содержит список разделенных пробелами символов. Браузер должен использовать первый имеющийся в раскладке клавиатуры символ из списка.</dd> + <dt id="attr-class"><code><a href="/ru/docs/Web/HTML/Global_attributes/class">class</a></code></dt> + <dd>Это список разделенных пробелами классов элемента. Классы позволяют CSS и JavaScript выбирать и получать доступ к конкретным элементам через <a href="/ru/docs/Web/CSS/Class_selectors" title="В HTML документе, селекторы по CSS классу находят элементы с нужным классом.">селекторы по классу</a> или через функции, такие как метод {{domxref("Document.getElementsByClassName()")}}.</dd> + <dt id="attr-contenteditable"><code><a href="/ru/docs/Web/HTML/Global_attributes/contenteditable">contenteditable</a></code></dt> + <dd>Это перечислимый атрибут, указывающий, нужно ли предоставить пользователю возможность редактировать элемент. Если это так, браузер изменит свой виджет таким образом, чтобы позволить редактирование. Атрибут должен принимать одно из следующих значений: + <ul> + <li><code>true</code> или <em>пустая строка</em>, указывает, что элемент должен быть редактируемым;</li> + <li><code>false</code>, указывает, что элемент не должен быть редактируемым.</li> + </ul> + </dd> + <dt id="attr-contextmenu"><code><a href="/ru/docs/Web/HTML/Global_attributes/contextmenu">contextmenu</a></code></dt> + <dd>Это <code><a href="#attr-id"><strong>id</strong></a></code> элемента {{HTMLElement("menu")}}, который следует использовать в качестве контекстного меню для данного элемента.</dd> + <dt id="attr-dataset"><code><a href="/ru/docs/Web/HTML/Global_attributes/data-*">data-*</a></code></dt> + <dd>Определяет группу атрибутов, называемых атрибутами пользовательских данных, позволяющих осуществлять обмен служебной информацией между <a href="/ru/docs/Web/HTML">HTML</a> и его <a href="/ru/docs/Glossary/DOM">DOM</a> представлением, что может быть использовано скриптами. Все такие пользовательские данные доступны через интерфейс {{domxref("HTMLElement")}} элемента у которого установлен атрибут. Свойство {{domxref("HTMLElement.dataset")}} предоставляет доступ к ним.</dd> + <dt id="attr-dir"><code><a href="/ru/docs/Web/HTML/Global_attributes/dir">dir</a></code></dt> + <dd>Это перечислимый атрибут указывающий направление текста в элементе. Он может принимать одно из следующих значений: + <ul> + <li><code>ltr</code>, что расшифровывается как <em>left to right </em>(слева направо), и предназначено для языков, в которых пишут слева направо (как в русском);</li> + <li><code>rtl</code>, что расшифровывается как <em>right to left</em> (справа налево), и предназначено для языков, в которых пишут справа налево (как в арабском);</li> + <li><code>auto</code> — позволяет принять решение пользовательскому приложению. Оно применяет базовый алгоритм — анализирует символы внутри элемента до тех пор, пока не найдет символ со строгим направлением, а затем применяет это направление ко всему элементу.</li> + </ul> + </dd> + <dt id="attr-draggable"><code><a href="/ru/docs/Web/HTML/Global_attributes/draggable">draggable</a></code> {{experimental_inline}}</dt> + <dd>Это перечислимый атрибут, указывающий, можно ли перетаскивать элемент используя <a href="/ru/docs/Web/Guide/HTML/Drag_and_drop">Drag and Drop API</a>. Он может иметь одно из следующих значений: + <ul> + <li><code>true</code>, указывающее, что элемент можно перетаскивать;</li> + <li><code>false</code>, указывающее, что элемень нельзя перетаскивать.</li> + </ul> + </dd> + <dt id="attr-dropzone"><code><a href="/ru/docs/Web/HTML/Global_attributes/dropzone">dropzone</a></code> {{experimental_inline}}</dt> + <dd>Это перечислимый атрибут, указывающий типы содержимого, которое можно перетащить в элемент с использованием <a href="/ru/docs/Web/Guide/HTML/Drag_and_drop">Drag and Drop API</a>. Он может иметь одно из следующих значений: + <ul> + <li><code>copy</code>, указывающее, что перетаскивание создаст копию перетаскиваемого элемента;</li> + <li><code>move</code>, указывающее, что перетаскиваемый элемент будет перемещен в новое расположение;</li> + <li><code>link</code> — создаст ссылку на перетаскиваемые данные.</li> + </ul> + </dd> + <dt id="attr-hidden"><code><a href="/ru/docs/Web/HTML/Global_attributes/hidden">hidden</a></code></dt> + <dd>Это логический атрибут, указывающий, что элемент уже (или еще) не актуален. Можно использовать этот атрибут, например для того, чтобы спрятать части страницы, которые не должны быть видны до завершения авторизации. Браузер не будет отображать такие элементы. Этот атрибут не должен использоваться, чтобы скрыть содержимое, которое может быть показано на законных основаниях.</dd> + <dt id="attr-id"><code><a href="/ru/docs/Web/HTML/Global_attributes/id">id</a></code></dt> + <dd>Определяет идентификатор (ID), который должен быть уникален для всего документа. Он предназначен для идентификации элемента при созданиии ссылок на него, исполнении скриптов или применении стилей (посредством CSS).</dd> + <dt id="attr-itemid"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemid">itemid</a></code> {{experimental_inline}}</dt> + <dt id="attr-itemprop"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemprop">itemprop</a></code> {{experimental_inline}}</dt> + <dt id="attr-itemref"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemref">itemref</a></code> {{experimental_inline}}</dt> + <dt id="attr-itemscope"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemscope">itemscope</a> </code>{{experimental_inline}}</dt> + <dt id="attr-itemtype"><code><a href="/ru/docs/Web/HTML/Global_attributes/itemtype">itemtype</a></code> {{experimental_inline}}</dt> + <dd>Эти атрибуты относятся к определению <a class="external" href="http://html.spec.whatwg.org/multipage/microdata.html">микроданных</a>.</dd> + <dt id="attr-lang"><code><a href="/ru/docs/Web/HTML/Global_attributes/lang">lang</a></code></dt> + <dd>Участвует в определении языка элемента, языка написания нередактируемых элементов или языка, на котором должны быть написаны редактируемые элементы. Содержит единственное значение в формате, определенном в документе IETF <a class="external" href="http://www.ietf.org/rfc/bcp/bcp47.txt" title="Tags for Identifying Languages"><em>BCP47</em></a>. <a href="#attr-xml:lang"><strong>xml:lang</strong></a> имеет приоритет над ним.</dd> + <dt id="attr-spellcheck"><code><a href="/ru/docs/Web/HTML/Global_attributes/spellcheck">spellcheck</a></code> {{experimental_inline}}</dt> + <dd>Это перечислимый атрибут, определяющий, может ли содержимое элемента быть проверено на наличие орфорафических ошибок. Он может принимать одно из следующих значений: + <ul> + <li><code>true</code>, указывающее, что элемент должен, по возможности, проверяться на наличие орфографических ошибок;</li> + <li><code>false</code>, указывающее, что элемент не должен проверяться на наличие орфографических ошибок.</li> + </ul> + </dd> + <dt id="attr-style"><code><a href="/ru/docs/Web/HTML/Global_attributes/style">style</a></code></dt> + <dd>Содержит описание стилей <a href="/ru/CSS">CSS</a>, которые должны быть применены к элементу. Учтите, что рекомендуется определять стили в отдельном файле или файлах. Этот атрибут, как и элемент {{ HTMLElement("style") }}, предназначен, в основном, для оперативного применения стилей, например в целях тестирования.</dd> + <dt id="attr-tabindex"><code><a href="/ru/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></code></dt> + <dd>Это числовой атрибут, указывающий, может ли элемент получать фокус, участвует ли он в последовательной навигации с клавиатуры, и если да, то в какой позиции. Может принимать одно из нескольких значений: + <ul> + <li><em>отрицательное число</em> означает, что элемент фокусируемый, но он не может получить фокус посредством последовательной навигации с клавиатуры;</li> + <li><code>0</code> означает, что элемент фокусируемый и может получить фокус посредством последовательной навигации с клавиатуры, но порядок его следования определяется платформой;</li> + <li><em>положительное значение</em> означает, что лемент фокусируемый и может получить фокус посредством последовательной навигации с клавиатуры. Порядок его следования определяется значением атрибута — последовательно возрастающего числа <a href="#attr-tabindex"><strong>tabindex</strong></a>. В случае, когда несколько элементов имеют одинаковое значение атрибута <strong><a href="#attr-tabindex">tabindex</a></strong>, порядок их следования при навигации определяется их местом в документе.</li> + </ul> + </dd> + <dt id="attr-title"><code><a href="/ru/docs/Web/HTML/Global_attributes/title">title</a></code></dt> + <dd>Содержит текст, предоставляющий консультативную информацию об элементе. Эта информация может, но не обязательно, показываться пользователю в виде всплывающей подсказки.</dd> + <dt id="attr-translate"><code><a href="/ru/docs/Web/HTML/Global_attributes/translate">translate</a></code></dt> + <dd>Это перечислимый атрибут, используемый для того, чтобы указать, следует ли переводить значения атрибутов элемента и его текстовое содержимое (содержимое узла {{domxref("Text")}}) при локализации страницы. Этот атрибут может принимать следующие значения: + <ul> + <li><em>пустая строка</em> или <code>"yes"</code> указывает, что элемент должен быть переведен;</li> + <li><code>"no</code>" указывает, что элемент не должен быть переведен.</li> + </ul> + </dd> +</dl> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#global-attributes", "Global attributes")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td><strong>temid</strong>, <strong>itemprop</strong>, <strong>itemref</strong>, <strong>itemscope</strong>, и <strong>itemtype</strong> были добавлены из последнего снимка — {{SpecName('HTML5.1')}}.</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#global-attributes", "Global attributes")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Снимок {{SpecName('HTML WHATWG')}}. <strong>spellcheck</strong>, <strong>draggable</strong> и <strong>dropzone</strong> были добавлены из {{SpecName('HTML5 W3C')}}.</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#global-attributes", "Global attributes")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Снимок {{SpecName('HTML WHATWG')}}. Концепция глобальных атрибутов представлена начиная с {{SpecName("HTML4.01")}} и атрибуты <strong>dir</strong>, <strong>lang</strong>, <strong>style</strong>, <strong>id</strong>, <strong>class</strong>, <strong>tabindex</strong>, <strong>accesskey</strong> и <strong>title</strong> становятся глобальными.<br> + <strong>xml:lang</strong> который был частью XHTML, теперь также является частью HTML.<br> + Были добавлены <strong>hidden</strong>, <strong>data-*</strong>, <strong>contextmenu</strong>, <strong>contenteditable</strong> и <strong><strong>translate</strong></strong>.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Глобальные атрибуты на определены. Некоторые атрибуты из тех, что стали глобальными в последующих спецификациях, определены в подмножестве элементов .<br> + <strong>class</strong> и <strong>style</strong> поддериваются для всех элементов кроме {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} и {{HTMLElement("title")}}.<br> + <strong>dir</strong> поддеривается для всех элементов кроме {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} и {{HTMLElement("script")}}.<br> + <strong>id</strong> поддеривается для всех элементов кроме {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} и {{HTMLElement("title")}}.<br> + <strong>lang</strong> поддеривается для всех элементов кроме {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} и {{HTMLElement("script")}}.<br> + <strong>tabindex</strong> поддеривается только для {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}} и {{HTMLElement("textarea")}}.<br> + <strong>accesskey</strong> поддеривается только для {{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }} и {{ HTMLElement("textarea") }}.<br> + <strong>title</strong> поддеривается для всех элементов кроме {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}} и {{HTMLElement("title")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<p>{{Compat("html.global_attributes")}}</p> + +<div id="compat-desktop"></div> + +<div id="compat-mobile"></div> + +<h2 id="См._также">См. также</h2> + +<ul> + <li>Интерфейсы {{domxref("Element")}} и {{domxref("GlobalEventHandlers")}}, которые позволяют запрашивать большинство глобальных атрибутов.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/inputmode/index.html b/files/ru/web/html/global_attributes/inputmode/index.html new file mode 100644 index 0000000000..feb9eaf958 --- /dev/null +++ b/files/ru/web/html/global_attributes/inputmode/index.html @@ -0,0 +1,60 @@ +--- +title: inputmode +slug: Web/HTML/Global_attributes/inputmode +translation_of: Web/HTML/Global_attributes/inputmode +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><span class="seoSummary"><a href="/ru/docs/Web/HTML/Общие_атрибуты">Глобальный атрибут</a> <strong><code>inputmode</code></strong> является вычисленным атрибутом, который предоставляет подсказку для типа данных, которые может ввести пользователь при редактировании содержания элемента.</span> Атрибут может принимать следующие значения:</p> + +<dl> + <dt><code>none</code></dt> + <dd>Без виртуальной клавиатуры; это полезно когда приложение или сайт имплементируют свои собственные клавиатуру или поле ввода.</dd> + <dt><code>text</code></dt> + <dd>Стандартная раскладка клавиатуры для пользователя, учитывая его локализацию.</dd> + <dt><code>decimal</code></dt> + <dd>Дробные значения чисел, содержащие разряд и соответствующий символ-разделитель, который учитывае локализацию пользователя (чаще всего "." или ","). Устройства могут показывать или нет символ минуса (отрицательное знаение).</dd> + <dt><code>numeric</code></dt> + <dd>Числовая раскладка клавиатуры; числа от 0 до 9. Устройства могут показывать или нет символ минуса (отрицательное значение).</dd> + <dt><code>tel</code></dt> + <dd>Раскладка для ввода номера телефона, включая числа от 0 до 9, звёздочку ("*"), и решетку ("#"). Поля ввода форм, что имеют обязательное поле номера телефона должны использовать <code><a href="/en-US/docs/Web/HTML/Element/input/tel"><input type="tel"></a></code>.</dd> + <dt><code>search</code></dt> + <dd>Виртуальная клавиатура, оптимизированная для работы с поиском. Например, кнопка ввода может быть заменена на "Поиск", и др.</dd> + <dt><code>email</code></dt> + <dd>Виртуальная клавиатура, оптимизированная для ввода электронной почты, с использованием символа "@" и др. Поля ввода форм, что имеют обязательное поле электронной почты должны использовать <code><a href="/en-US/docs/Web/HTML/Element/input/email"><input type="email"></a></code>.</dd> + <dt><code>url</code></dt> + <dd>Виртуальная клавиатура, оптимизированная для ввода ссылок. Может иметь кнопку "/", расположенную в более удобном месте. Поле может содержать функцию истории ввода и др. Поля ввода форм, что имеют обязательное поле ссылки URL должны использовать <code><a href="/en-US/docs/Web/HTML/Element/input/url"><input type="url"></a></code>.</dd> +</dl> + +<p>Атрибутом по умолчанию является <code>text</code>, которое учитывает локализацию пользователя.</p> + +<h2 id="Спецификация">Спецификация</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("HTML WHATWG", "interaction.html#input-modalities:-the-inputmode-attribute", "inputmode")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + + + +<p>{{Compat("html.global_attributes.inputmode")}}</p> + +<h2 id="См._также">См. также</h2> + +<ul> + <li>Все <a href="/ru/docs/Web/HTML/Общие_атрибуты">глобальные атрибуты</a>.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/is/index.html b/files/ru/web/html/global_attributes/is/index.html new file mode 100644 index 0000000000..a80c1772d1 --- /dev/null +++ b/files/ru/web/html/global_attributes/is/index.html @@ -0,0 +1,62 @@ +--- +title: is +slug: Web/HTML/Global_attributes/is +translation_of: Web/HTML/Global_attributes/is +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><span class="seoSummary"><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут </a> <strong><code>is</code></strong> позволяет указать, что стандартный HTML-элемент должен вести себя как определенный пользовательский встроенный элемент (см <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">Using custom elements</a> для информации).</span></p> + +<p>Этот атрибут может быть использован только, если указанное имя пользовательского элемента было успешно <a href="/en-US/docs/Web/API/CustomElementRegistry/define">определено</a> в текущем документе и расширяет тип элемента, к которому оно применяется.</p> + +<h2 id="Примеры">Примеры</h2> + +<p>Следующий код взят из нашего примеры <a href="https://github.com/mdn/web-components-examples/tree/master/word-count-web-component">word-count-web-component</a> (<a href="https://mdn.github.io/web-components-examples/word-count-web-component/">см. в живую</a>).</p> + +<pre class="brush: js">// Создание класса для элемента +class WordCount extends HTMLParagraphElement { + constructor() { + // Всегда вызывайте super первым в конструкторе + super(); + + // Содержимое конструктора опущено для краткости + ... + + } +} + +// Определение нового элемента +customElements.define('word-count', WordCount, { extends: 'p' });</pre> + +<pre class="brush: html"><p is="word-count"></p></pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', "custom-elements.html#attr-is", "is")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Поддержка_браузерами">Поддержка браузерами</h2> + + + +<p>{{Compat("html.global_attributes.is")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>All <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/itemid/index.html b/files/ru/web/html/global_attributes/itemid/index.html new file mode 100644 index 0000000000..6fbadf42b5 --- /dev/null +++ b/files/ru/web/html/global_attributes/itemid/index.html @@ -0,0 +1,106 @@ +--- +title: itemid +slug: Web/HTML/Global_attributes/itemid +tags: + - микроданные +translation_of: Web/HTML/Global_attributes/itemid +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><span class="seoSummary"><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут </a><code><strong>itemid</strong></code> предоставляет микроданные в форме уникального глобального идентификатора элемента.</span> Атрибут <code>itemid</code> может быть указан только для элемента, который имеет оба атрибута {{htmlattrxref("itemscope")}} и {{htmlattrxref("itemtype")}}. Также, <code>itemid</code> может бытьуказан только для элементов, обладающих атрибутом<code>itemscope,</code> соответствующий ссылке<code>itemtype</code> или определяющий словарь, поддерживающий глобальные идентификаторы.</p> + +<p>Точное значение глобального идентификатора <code>itemtype</code> обеспечивается определением этого идентификатора в пределах указанного словаря. Словарь определяет, могут ли сосуществовать несколько элементов с одним и тем же глобальным идентификатором, и, если да, то как обрабатывабтся элементы с одним и тем же идентификатором.</p> + +<p class="note"><strong>Примечание:</strong> Определение Whatwg.org указывает, что <code>itemid</code> должен быть URL. Однако, следующий пример правильно иллюстрирует, что URN, также может быть использован. Это несоответствие может отражать неполную природу спецификации микроданных.</p> + +<h2 id="Пример">Пример</h2> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html"><dl itemscope + itemtype="http://vocab.example.net/book" + itemid="urn:isbn:0-330-34032-8"> +<dt>Title <dd itemprop="title">The Reality Dysfunction +<dt>Author <dd itemprop="author">Peter F. Hamilton +<dt>Publication date +<dd><time itemprop="pubdate" datetime="1996-01-26">26 January 1996</time> </dl></pre> + +<h3 id="Структура_данных">Структура данных</h3> + +<table class="standard-table"> + <tbody> + <tr> + <td colspan="1" rowspan="14">itemscope</td> + <td>itemtype: itemid</td> + <td colspan="2" rowspan="1"> + <div class="jyrRxf-eEDwDf jcd3Mb IZ65Hb-hUbt4d">http://vocab.example.net/book: urn:isbn:0-330-34032-8</div> + </td> + </tr> + <tr> + <td>itemprop</td> + <td>title</td> + <td>The Reality Dysfunction</td> + </tr> + <tr> + <td>itemprop</td> + <td>author</td> + <td> + <div class="jyrRxf-eEDwDf jcd3Mb">Peter F. Hamilton</div> + </td> + </tr> + <tr> + <td>itemprop</td> + <td>pubdate</td> + <td>1996-01-26</td> + </tr> + </tbody> +</table> + +<h3 id="Результат">Результат</h3> + +<p>{{EmbedLiveSample('HTML', '', '', '', 'Web/HTML/Global_attributes/itemid')}}</p> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML Microdata', "#items", "itemid")}}</td> + <td>{{Spec2('HTML Microdata')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "microdata.html#attr-itemid", "itemid")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Поддержка_браузерами">Поддержка браузерами</h2> + + + +<p>{{Compat("html.global_attributes.itemid")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTML/Global_attributes">Другие различные глобальные атрибуты</a></li> + <li>Другие глобальные атрибуты, связанные с микроданными + <ul> + <li>{{htmlattrxref("itemid")}}</li> + <li>{{htmlattrxref("itemprop")}}</li> + <li>{{htmlattrxref("itemref")}}</li> + <li>{{htmlattrxref("itemscope")}}</li> + <li>{{htmlattrxref("itemtype")}}</li> + </ul> + </li> +</ul> diff --git a/files/ru/web/html/global_attributes/lang/index.html b/files/ru/web/html/global_attributes/lang/index.html new file mode 100644 index 0000000000..c8dc52d542 --- /dev/null +++ b/files/ru/web/html/global_attributes/lang/index.html @@ -0,0 +1,90 @@ +--- +title: lang +slug: Web/HTML/Global_attributes/lang +tags: + - HTML +translation_of: Web/HTML/Global_attributes/lang +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><a href="https://wiki.developer.mozilla.org/ru/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <code>lang</code> помогает определить язык элемента: язык, на котором написаны нередактируемые элементы, или язык, на котором пользователем должны быть написаны редактируемые элементы. Атрибут содержит единственный “языковой тег” (<code>language tag</code>) в формате, определенном в <em><a class="external" href="https://www.ietf.org/rfc/bcp/bcp47.txt">Tags for Identifying Languages (BCP47)</a>.</em></p> + +<div>{{EmbedInteractiveExample("pages/tabbed/attribute-lang.html","tabbed-shorter")}}</div> + +<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p> + +<p>Если значение атрибута — <em>пустая строка</em> (<code>lang=""</code>), язык устанавливается, как <em>неизвестный</em>. Если тег языка недействителен согласно BCP47, он устанавливается, как <em>недействительный</em>.</p> + +<div class="note"> +<h2 id="Синтаксис_языкового_тега">Синтаксис языкового тега</h2> + +<p>Подробный синтаксис BCP47 достаточно подробен, чтобы отмечать специфичные языковые диалекты, но в большинстве случаев его использование намного проще. </p> + +<p>Языковой тег состоит из <em>языковых вложенных тегов</em>, разделенных дефисом, где каждый вложенный тег указывает на определенное свойство языка. 3 наиболее распространенных вложенных тега:</p> + +<dl> + <dt>Языковой подтег</dt> + <dd>Обязателен. Двух-или-трех-символьный код, определяющий базовый язык, обычно записываемый в нижнем регистре. К примеру, код английского языка является <code>en</code>, а для Бадеши — <code>bdz</code>. </dd> + <dt>Подтег скрипта</dt> + <dd>Необязателен. Данный подтег определяет систему записи, и всегда состоящий из 4 символов с первой заглавной буквой. К примеру, французский язык Брайля — это <code>fr-Brai</code>, а <code>ja-Kana</code> — это японский язык, написанный с использованием алфавита Катакана (Katakana). Если язык написан типичным способом, например, английский с латинским алфавитом, нет необходимости использовть данный подтег.</dd> + <dt>Подтег региона</dt> + <dd>Необязателен. Данный подтег определяет диалект основного языка из определенного места и состоит из двух букв в ALLCAPS, соответствующих коду страны, или трех цифр, соответствующих региону, который не относится к стране. К примеру, <code>es-ES</code> — это испанский язык, на котором разговаривают в Испании, а <code>es-013</code> означает испанский язык, на котором разговаривают в Центральной Америке. “Международный испанский” было бы просто <code>es</code>.</dd> +</dl> + +<p>Подтег скрипта предшествует подтегу региона, если присутствуют оба тега — <code>ru-Cyrl-BY</code> — это русский язык, написанный кириллицей, на котором разговаривают в Беларуси. </p> + +<p>Чтобы найти правильный подтег кода языка, используйте <a href="https://r12a.github.io/app-subtags/" rel="external">the Language Subtag Lookup</a>.</p> +</div> + +<p>Даже если указан атрибут <strong>lang</strong>, то он может не учитываться, поскольку атрибут <strong><a href="/ru/docs/Web/HTML/Global_attributes/xml:lang">xml:lang</a> </strong>имеет приоритет над <strong>lang</strong>.</p> + +<p>Для псевдо-класса CSS {{cssxref(":lang")}}, два недопустимых названия языка будут разными, если их имены различны. Хотя, <code>:lang(es)</code> соответствует обоим <code>lang="es-ES"</code> и <code>lang="es-419"</code>, но <code>:lang(xyzzy)</code> не соответствует <code>lang="xyzzy-Zorp!"</code>.</p> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> + <p>No change from latest snapshot,{{SpecName('HTML5.1')}}</p> + </td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}}, behavior with <code>xml:lang</code> and language determination algorithm defined. It also is a true global attribute.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'struct/dirlang.html#h-8.1', 'lang')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Supported on all elements but {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, and {{HTMLElement("script")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + + + +<p>{{Compat("html.global_attributes.lang")}}</p> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>Все <a href="/ru/docs/Web/HTML/Global_attributes">глобальные атрибуты</a>.</li> + <li><a href="/en-US/docs/Web/HTTP/Headers/Content-Language"><code>Content-Language</code> HTTP Header</a></li> +</ul> diff --git a/files/ru/web/html/global_attributes/style/index.html b/files/ru/web/html/global_attributes/style/index.html new file mode 100644 index 0000000000..949cd53910 --- /dev/null +++ b/files/ru/web/html/global_attributes/style/index.html @@ -0,0 +1,111 @@ +--- +title: style +slug: Web/HTML/Global_attributes/style +tags: + - HTML + - Глобальные атрибуты + - Руководство +translation_of: Web/HTML/Global_attributes/style +--- +<div>{{HTMLSidebar("Global_attributes")}}</div> + +<p><a href="/en-US/docs/Web/HTML/Global_attributes">Глобальный атрибут</a> <strong>стиля</strong> содержит объявления стилей CSS, которые могут применяться к элементу. Обратите внимание: рекомендуется, чтобы стили были определены в отдельном файле или файлах. Этот атрибут и элемент {{HTMLElement ("style")}} имеют в основном назначение для быстрого добавления стиля, например, для целей тестирования.</p> + +<div class="note"> +<p><strong>Замечание об использовании: </strong>этот атрибут не должен использоваться для передачи семантической информации. Даже если весь стиль удаляется, страница должна оставаться семантически корректной. Обычно он не должен использоваться для скрытия несущественной информации; это должно быть сделано с использованием <a href="#attr-hidden"><strong>скрытого</strong></a> атрибута.</p> +</div> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "dom.html#the-style-attribute", "style")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Без изменений от последнего моментального снимка, {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "dom.html#the-style-attribute", "style")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Снимок {{SpecName ('HTML WHATWG')}}, без изменений от {{SpecName ('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "dom.html#the-style-attribute", "style")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Моментальный снимок {{SpecName ('HTML WHATWG')}}. Из {{SpecName ("HTML4.01")}} теперь это истинный глобальный атрибут</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'present/styles.html#h-14.2.2', 'style')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Поддерживает все элементы, кроме {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, и {{HTMLElement("title")}}.</td> + </tr> + <tr> + <td>{{SpecName("CSS3 Style", "", "")}}</td> + <td>{{Spec2("CSS3 Style")}}</td> + <td>Определяет содержимое атрибута <code>style</code>.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузером">Совместимость с браузером</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Особенность</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Особенность</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Смотрите_также">Смотрите также</h2> + +<ul> + <li>Все <a href="/en-US/docs/Web/HTML/Global_attributes">глобальные атрибуты</a>.</li> +</ul> diff --git a/files/ru/web/html/global_attributes/tabindex/index.html b/files/ru/web/html/global_attributes/tabindex/index.html new file mode 100644 index 0000000000..cd63df6b7a --- /dev/null +++ b/files/ru/web/html/global_attributes/tabindex/index.html @@ -0,0 +1,112 @@ +--- +title: tabindex +slug: Web/HTML/Global_attributes/tabindex +translation_of: Web/HTML/Global_attributes/tabindex +--- +<p>{{HTMLSidebar("Global_attributes")}}</p> + +<p class="note">Максимальное значение для tabindex не должно превышать 32767 (W3C 17.11.1)</p> + +<p><a href="https://developer.mozilla.org/ru/docs/Web/HTML/%D0%9E%D0%B1%D1%89%D0%B8%D0%B5_%D0%B0%D1%82%D1%80%D0%B8%D0%B1%D1%83%D1%82%D1%8B">Глобальный атрибут</a> <strong>tabindex </strong>-<strong> </strong>целое число, определяющее должен ли данный элемент участвовать в последовательной навигации по всей странице с помощью клавиатуры, в каком порядке. Содержит одно из нескольких видов значений:</p> + +<ul> + <li>если представлено <em>отрицательное значение</em> – элемент может быть выделен, однако не участвует в последовательной навигации;</li> + <li>если представлен <strong>0</strong> – элемент может быть выделен и достигнут с помощью последовательной навигации, однако порядок навигации определён платформой;</li> + <li>если представлено <em>положительное целое значение</em> – элемент будет достигнут (и выделен) с помощью последовательной навигации, а порядок навигации определён этим самым значением. В случае, если несколько элементов содержат одно и то же значение <strong>tabindex</strong>, их порядок навигации определён относительным расположением в документе (DOM).</li> +</ul> + +<p>Элементы со значением 0, некорректным значением, или элементы с отсутствующим значением <strong>tabindex </strong>должны быть расположены после элементов с положительным целым числом.</p> + +<p>Для более полного объяснения навигации смотри <a href="https://developer.mozilla.org/ru/docs/Web/HTML/Focus_management_in_HTML">данную статью</a>.</p> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "editing.html#attr-tabindex", "tabindex")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Нет изменений с предыдущей спецификации {{SpecName('HTML5.1')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', "editing.html#attr-tabindex", "tabindex")}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>{{SpecName('HTML WHATWG')}}, нет изменений с {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', "editing.html#attr-tabindex", "tabindex")}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>{{SpecName('HTML WHATWG')}}. От {{SpecName("HTML4.01")}}, атрибут теперь поддерживается всеми элементами.</td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'interact/forms.html#adef-tabindex', 'tabindex')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>Поддерживается только {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}}, и {{HTMLElement("textarea")}}.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Chrome for Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Смотри_также">Смотри также</h2> + +<ul> + <li>Все <a href="/en-US/docs/Web/HTML/Global_attributes">глобальные атрибуты</a>.</li> + <li>{{domxref("HTMLElement.tabindex")}} отражает этот атрибут.</li> + <li>Проблемы доступности (юзабилити): смотри <a href="http://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html" id="id-22" style="font-size: inherit; line-height: inherit;" title="Don’t Use Tabindex Greater than 0 | Adrian Roselli">Don’t Use Tabindex Greater than 0 | Adrian Roselli</a>.</li> +</ul> |
