initial commit

14 files changed, 1580 insertions, 0 deletions

diff --git a/files/ru/web/api/htmlelement/click/index.html b/files/ru/web/api/htmlelement/click/index.html
new file mode 100644
index 0000000000..d800f52724
--- /dev/null
+++ b/files/ru/web/api/htmlelement/click/index.html
@@ -0,0 +1,115 @@
+---
+title: HTMLElement.click()
+slug: Web/API/HTMLElement/click
+translation_of: Web/API/HTMLElement/click
+---
+<div>
+<div>{{ APIRef("HTML DOM") }}</div>
+</div>
+
+<p>Метод <code><strong>HTMLElement.click()</strong></code> имитирует клик мышкой по элементу.</p>
+
+<p>Когда <code>click()</code> используется с поддерживающими его элементами (такими, например, как {{HTMLElement("input")}}), он вызывает срабатывание события клика мышкой. Это событие затем всплывает вверх по дереву элементов (или цепочке событий) и вызывает срабатывание уже их событий по клику мышкой.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><em>element</em>.click()</pre>
+
+<h2 id="Specification">Specification</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('DOM2 HTML', 'html.html#ID-2651361')}}</td>
+   <td>{{Spec2('DOM2 HTML')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>20<sup>[3]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>5<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[2]</sup></td>
+   <td>6<sup>[3]</sup></td>
+  </tr>
+  <tr>
+   <td><code>input@file (limited)</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>4</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>12.10</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>input@file (full)</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>4</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</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>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Относится к  Gecko 5.0 {{geckoRelease("5.0")}}, Gecko не будет реализовывать метод  <code>click()</code>  на других элементах, которые, как можно ожидать,  будут реагировать на клик мышкой, на такие как "ссылка"  ({{HTMLElement("a")}} элементы), также это не обязательно вызовет срабатывание события "клик мышкой" у других элементов.</p>
+
+<p>[2] В версиях Opera, базируемых на Presto, метод <code>click()</code> будет без ошибок проигнорирован, если вызывается на поле {{HTMLElement("input")}} у которого  <strong><code>type</code> </strong>указан как <code>file</code> и <a href="/en-US/docs/Web/CSS">CSS</a> свойство {{cssxref('display')}} установлено <code>none</code>.</p>
+
+<p>[3] Предыдущие версии имели только <code>HTMLInputElement.click()</code> и <code>HTMLButtonElement.click()</code> .</p>
diff --git a/files/ru/web/api/htmlelement/contenteditable/index.html b/files/ru/web/api/htmlelement/contenteditable/index.html
new file mode 100644
index 0000000000..d231018d4a
--- /dev/null
+++ b/files/ru/web/api/htmlelement/contenteditable/index.html
@@ -0,0 +1,115 @@
+---
+title: HTMLElement.contentEditable
+slug: Web/API/HTMLElement/contentEditable
+translation_of: Web/API/HTMLElement/contentEditable
+---
+<div>
+<div>{{ APIRef("HTML DOM") }}</div>
+</div>
+
+<p>Свойство <strong><code>HTMLElement.contentEditable</code></strong> элемента - признак, указывающий можно или нет редактировать содержимое элемента. Своство может принимать следующие значения:</p>
+
+<ul>
+ <li><code>true или пустая строка - содержимое элемента доступно для редактирования</code>.</li>
+ <li><code>false</code> - содержимое элемента не доступно для редактирования.</li>
+ <li><code>inherit</code> - наследуется значение занного свойства от родительского элемента.</li>
+</ul>
+
+<p>Вы можете использовать свойство {{domxref("HTMLElement.isContentEditable")}}, чтобы проверить {{domxref("Boolean")}} значение этого свойства.</p>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="syntaxbox"><em>editable</em> = element.contentEditable
+element.contentEditable = "true"
+</pre>
+
+<h2 id="Specifications" name="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', 'interaction.html#contenteditable', 'contenteditable')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<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>Basic support</td>
+   <td>11</td>
+   <td>{{CompatGeckoDesktop(1.9)}}</td>
+   <td>6</td>
+   <td>10.6</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>3</td>
+   <td>{{CompatGeckoMobile(1.9)}}</td>
+   <td>6</td>
+   <td>{{CompatNo}}</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Bugs" name="Bugs">Bugs</h3>
+
+<ul>
+ <li><a href="https://connect.microsoft.com/IE/feedback/details/796187/internet-explorer-10-crash-with-contenteditable-list">IE bug 796187</a>: IE10 crashes in some cases when editing lists</li>
+ <li><a href="https://connect.microsoft.com/IE/feedback/details/858749">IE bug 858749</a>: IE11+ uses invalid positioning for caret when an element is floated</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/809254">IE bug 809254</a>: IE9-10 window freezes when using mousewheel while dragging</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/794285">IE bug 794285</a>: IE10-11 does not fire the <a href="/en-US/docs/Web/Events/input"><code>input</code></a> event</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/801770">IE bug 801770</a>: IE10 crashes after selecting "Cut" from the context menu</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/807199">IE bug 807199</a>: IE11+ does not allow placing the caret in an empty table cell</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/774350">IE bug 774350</a>: IE10 does not fire <a href="/en-US/docs/Web/Events/contextmenu"><code>contextmenu</code></a> event when right-clicking on misspelled words</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/864804">IE bug 864804</a>: IE11 appends {{HTMLElement("br")}} elements to {{HTMLElement("body")}} when showing/hiding an {{HTMLElement("iframe")}} with contenteditable document inside</li>
+ <li><a href="https://connect.microsoft.com/IE/feedbackdetail/view/907422">IE bug 907422</a>: IE11 does not allow disabling resize handles for images/inputs</li>
+</ul>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("HTMLElement.isContentEditable")}}</li>
+ <li>The <a href="/en-US/docs/Web/HTML/Global_attributes/contenteditable">contenteditable</a> global attribute.</li>
+ <li><a href="https://medium.com/medium-eng/why-contenteditable-is-terrible-122d8a40e480">Why ContentEditable is Terrible, Or: How the Medium Editor Works</a></li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/dataset/index.html b/files/ru/web/api/htmlelement/dataset/index.html
new file mode 100644
index 0000000000..328b265afa
--- /dev/null
+++ b/files/ru/web/api/htmlelement/dataset/index.html
@@ -0,0 +1,114 @@
+---
+title: HTMLElement.dataset
+slug: Web/API/HTMLElement/dataset
+translation_of: Web/API/HTMLOrForeignElement/dataset
+---
+<p>{{ APIRef("HTML DOM") }}</p>
+
+<p>Свойство <code><strong>HTMLElement.dataset</strong></code> предоставляет доступ как для чтения, так и для изменения всех пользовательских дата-атрибутов <a href="/en/HTML/Global_attributes#attr-data-*" title="https://developer.mozilla.org/en/HTML/Global_attributes#attr-data-*">custom data attributes</a> (<code>data-*</code>) , установленных у элемента. Это <a href="/en/DOM/DOMStringMap" title="en/DOM/DOMStringMap">map of DOMString</a>, одна запись для каждого пользовательского атрибута данных. Обратите внимание, свойство <code><strong>dataset</strong></code> доступно только для чтения. Для записи должны использоваться  его "свойства", которые представлены data-атрибутами. Также обратите внимание, что HTML <code><strong>data-</strong></code><em>атрибут</em> и соответствующий ему DOM-<code>dataset.</code><em>property</em> не имеют одно и то же имя, но они всегда похожи:</p>
+
+<ul>
+ <li>Имя пользовательского дата атрибута в HTML начинается с "<code>data-</code>". Оно может состоять из букв, цифр и символов: дефис-минус (<code>-</code>, <code>U+002D</code>), точка (<code>.</code>), двоеточие (<code>:</code>), подчеркивание (<code>_</code>). Имя НЕ МОЖЕТ включать в себя заглавные буквы.</li>
+ <li>Имя пользовательского дата-атрибута в Javascript — это имя того же атрибута в HTML, но с использованием нотации camelCase и без дефисов, точек и т.д.<br>
+  <br>
+  В дополнение к приведенной ниже информации вы найдете руководство по использованию HTML data-атрибутов в нашей статье <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Использование data-атрибутов</a>.</li>
+</ul>
+
+<h3 id="Преобразование_имён">Преобразование имён</h3>
+
+<p><code>dash-style</code> в <code>camelCase</code>: имя пользовательского дата-атрибута преобразуется в ключ для {{ domxref("DOMStringMap") }} по следующим правилам:</p>
+
+<ul>
+ <li>удаляется префикс <code>data-</code> (вместе с дефисом);</li>
+ <li>дефисы (<code>U+002D</code>) со следующими за ними <span style="line-height: 1.5;">ASCII-символами </span><code>a</code><span style="line-height: 1.5;">-</span><code>z</code><span style="line-height: 1.5;"> в нижнем регистре: черта удаляется, а символ преобразуется в верхний регистр;</span></li>
+ <li>остальные символы (включая дефисы) остаются без изменений.</li>
+</ul>
+
+<p><code>camelCase</code> в <code>dash-style</code>: обратное преобразование ключа в имя атрибута производится по следующим правилам:</p>
+
+<ul>
+ <li>Ограничение: сразу после дефиса не может быть ASCII-символа <code>a</code>-<code>z</code> в нижнем регистре (до преобразования);</li>
+ <li>добавляется префикс <code>data-</code>;</li>
+ <li>все ASCII-символы <code>A</code>-<code>Z</code> в верхнем регистре заменяются на дефис с символом в нижнем регистре;</li>
+ <li>остальные символы остаются без изменений.</li>
+</ul>
+
+<p>Ограничение в правилах гарантирует, что эти два преобразования являются обратными друг другу.</p>
+
+<p>Например, атрибуту <code>data-abc-def</code> соответствует ключ <code>abcDef</code>.</p>
+
+<h3 id="Доступ_к_значениям">Доступ к значениям</h3>
+
+<ul>
+ <li>Атрибуты можно устанавливать и считывать по имени в camelCase (ключ) как свойство объекта dataset, например <em>element.</em>dataset.<em>keyname</em></li>
+ <li>Атрибуты также можно устанавливать и считывать с использованием доступа к свойствам объекта через квадратные скобки, например <em>element.</em>dataset[<em>keyname</em>]</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/in">Оператор in</a> может быть использован для проверки существования атрибута.</li>
+</ul>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<ul>
+ <li><em>string</em> = <em>element</em>.<strong>dataset</strong>.<em>camelCasedName</em>;</li>
+ <li><em>element.</em><strong>dataset</strong>.<em>camelCasedName</em> = <em>string</em>;</li>
+ <br>
+ <li><em>string</em> = <em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>];</li>
+ <li><em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>] = <em>string</em>;</li>
+ <br>
+ <li><em>Custom data attributes can also be set directly on HTML elements, but attribute names must use the data- syntax above. </em></li>
+</ul>
+
+<h2 id="Примеры">Примеры</h2>
+
+<pre class="brush: js notranslate">&lt;div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth&gt;John Doe&lt;/div&gt;
+
+let el = document.querySelector('#user');
+
+// el.id == 'user'
+// el.dataset.id === '1234567890'
+// el.dataset.user === 'johndoe'
+// el.dataset.dateOfBirth === ''
+
+el.dataset.dateOfBirth = '1960-10-03'; // set the DOB.
+
+// 'someDataAttr' in el.dataset === false
+el.dataset.someDataAttr = 'mydata';
+// 'someDataAttr' in el.dataset === true
+</pre>
+
+<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#dom-dataset", "HTMLElement.dataset")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change from latest snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}</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#dom-dataset", "HTMLElement.dataset")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>
+
+<p>{{Compat("api.HTMLElement.dataset")}}</p>
+
+<h2 id="См._также">См. также</h2>
+
+<ul>
+ <li>The HTML <a href="/en-US/docs/Web/HTML/Global_attributes/data-*"><strong>data-*</strong></a> class of global attributes.</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/api/htmlelement/hidden/index.html b/files/ru/web/api/htmlelement/hidden/index.html
new file mode 100644
index 0000000000..854f08e186
--- /dev/null
+++ b/files/ru/web/api/htmlelement/hidden/index.html
@@ -0,0 +1,192 @@
+---
+title: HTMLElement.hidden
+slug: Web/API/HTMLElement/hidden
+translation_of: Web/API/HTMLElement/hidden
+---
+<div>
+<div>HTMLElement <span class="seoSummary">Свойство <strong><code>hidden</code></strong> является {{jsxref("Boolean")}} типом данных , который принимает значение true , если содержимое спрятано, в противном случае значение будет false. Это свойство соверешенно отличается от использования CSS свойства {{cssxref("display")}} , чтобы контролировать отображение элемента.Свойство </span><code>hidden</code> <span class="seoSummary">применимо ко всем режимам  представления и не должно использоваться для скрытия содержимого предназначенного для прямого доступа к пользователю. Соответствующие варианты использования включают:</span></div>
+</div>
+
+<ul>
+ <li> Содержимое, которое не является особенно важным, но может быть необходимо позже</li>
+ <li>Содержимое, которое было раньше необходимо, но больше нет в нем необходимости</li>
+ <li>Содержимое, которое повторно используется другими частями страницы по шаблону</li>
+ <li>Создание заставного холста в качестве буфера рисования</li>
+</ul>
+
+<p>Неуместные варианты использования включают:</p>
+
+<ul>
+ <li>Скрытие панелей в диалоговом окне с вкладками</li>
+ <li>Скрытие содержимого в одной презентации, предполагая, что оно будет видимым в других</li>
+</ul>
+
+<div class="note">
+<p>Элементы, которые не hidden не должны ссылаться на элементы которые hidden.</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="syntaxbox"><em>isHidden</em> = <em>HTMLElement</em>.hidden;
+
+
+<em>HTMLElement</em>.hidden = true | false;</pre>
+
+<h3 id="Значение">Значение</h3>
+
+<p>Если элемент спрятан, то значение <em><strong>true</strong></em>, в противном случае <em><strong>false</strong></em>;  </p>
+
+<h2 id="Example" name="Example">Пример</h2>
+
+<p>Пример, где скрытий блок используется для хранения "thank you" сообщения, которое отображается после того, как пользователь соглашается с необычным запросом.</p>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js">document.getElementById("okButton")
+        .addEventListener("click", function() {
+  document.getElementById("welcome").hidden = true;
+  document.getElementById("awesome").hidden = false;
+}, false);</pre>
+
+<p>Этот код устанавливает обработчика для кнопки "OK", которая скрывает панель приветсвия и делает The follow-up panel панель с необычным именем "awesome" - видимой в этом месте.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<p>HTML-код для двух boxes показанных здесь.</p>
+
+<h4 id="Welcome_panel">Welcome panel</h4>
+
+<pre class="brush: html">&lt;div id="welcome" class="panel"&gt;
+  &lt;h1&gt;Welcome to Foobar.com!&lt;/h1&gt;
+  &lt;p&gt;By clicking "OK" you agree to be awesome every day!&lt;/p&gt;
+  &lt;button class="button" id="okButton"&gt;OK&lt;/button&gt;
+&lt;/div&gt;</pre>
+
+<p>Этот  HTML создает панель, которая приветствует пользователей на сайте и рассказывает им о том с чем они соглашаются нажимая на кнопку OK.</p>
+
+<h4 id="The_follow-up_panel">The follow-up panel</h4>
+
+<p>После того, как пользователь нажимает OK в welcome panel, JavaScript код меняет две панели изменяя их значения hidden. Cледующая The follow-up panel представлена в этом HMTL:</p>
+
+<pre class="brush: html">&lt;div id="awesome" class="panel" hidden&gt;
+  &lt;h1&gt;Thanks!&lt;/h1&gt;
+  &lt;p&gt;Thank you &lt;strong&gt;so&lt;/strong&gt; much for agreeing to be
+  awesome today! Now get out there and do awesome things
+  awesomely to make the world more awesome!&lt;/p&gt;
+&lt;/div&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<p>Стилизованное содержимое использует CSS предсталвенное внизу.</p>
+
+<pre class="brush: css">.panel {
+  font: 16px "Open Sans", Helvetica, Arial, sans-serif;
+  border: 1px solid #22d;
+  padding: 12px;
+  width: 500px;
+  text-align: center;
+}
+
+.button {
+  font: 22px "Open Sans", Helvetica, Arial, sans-serif;
+  padding: 5px 36px;
+}
+
+h1 {
+  margin-top: 0;
+  font-size: 175%;
+}</pre>
+
+<h3 id="Результат">Результат</h3>
+
+<p>{{ EmbedLiveSample('Example', 560, 200) }}</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', "interaction.html#dom-hidden", "HTMLElement.hidden")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "HTMLElement.hidden")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "editing.html#the-hidden-attribute", "HTMLElement.hidden")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </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>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("2") }}</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>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("2") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li>{{domxref("Element.hidden")}}</li>
+ <li>{{cssxref("display")}}</li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/index.html b/files/ru/web/api/htmlelement/index.html
new file mode 100644
index 0000000000..7953983323
--- /dev/null
+++ b/files/ru/web/api/htmlelement/index.html
@@ -0,0 +1,402 @@
+---
+title: HTMLElement
+slug: Web/API/HTMLElement
+translation_of: Web/API/HTMLElement
+---
+<div>
+<div>{{ APIRef("HTML DOM") }}</div>
+</div>
+
+<div></div>
+
+<p>Интерфейс <strong><code>HTMLElement</code></strong> представляет собой любой элемент <a href="/en-US/docs/Web/HTML" title="/en-US/docs/Web/HTML">HTML</a>. Некоторые элементы напрямую используют этот интерфейс, другие - через промежуточный интерфейс.</p>
+
+<p>{{InheritanceDiagram}}</p>
+
+<h2 id="Свойства">Свойства</h2>
+
+<p><em>Наследует свойства родителя, {{domxref("Element")}}, и реализует их через {{domxref("GlobalEventHandlers")}} и {{domxref("TouchEventHandlers")}}.</em></p>
+
+<dl>
+ <dt>{{domxref("HTMLElement.accessKey")}} -- ключ доступа</dt>
+ <dd>Эта строковая переменная {{domxref("DOMString")}} отображает ключ доступа, сопоставленный элементу <em>{{domxref("Element")}}</em>.</dd>
+ <dt>{{domxref("HTMLElement.accessKeyLabel")}} {{readonlyInline}}</dt>
+ <dd>Возвращает {{domxref ("DOMString")}}, содержащий назначенный ключ доступа элемента.</dd>
+ <dt>{{domxref("HTMLElement.contentEditable")}}</dt>
+ <dd>Является {{domxref ("DOMString")}}, где значение" true "означает, что элемент доступен для редактирования, а значение" false " означает, что это не так.</dd>
+ <dt>{{domxref("HTMLElement.isContentEditable")}} {{readonlyInline}}</dt>
+ <dd>Возвращает {{domxref ("Boolean")}}, который указывает, можно ли редактировать содержимое элемента.</dd>
+ <dt>{{domxref("HTMLElement.contextMenu")}}</dt>
+ <dd>Является {{domxref ("HTMLMenuElement")}}, представляющим контекстное меню, связанное с элементом. Может быть null</dd>
+ <dt>{{domxref("HTMLElement.dataset")}} {{readonlyInline}} -- набор данных</dt>
+ <dd>Возвращает {{domxref("domstringmap")}}, который позволяет получить доступ к чтению и записи атрибутов пользовательских данных элемента (data-*) .</dd>
+ <dt>{{domxref("HTMLElement.dir")}}</dt>
+ <dd>Is a {{domxref("DOMString")}}, reflecting the <code>dir</code> global attribute, representing the directionality of the element. Possible values are <code>"ltr"</code>, <code>"rtl"</code>, and <code>"auto"</code>.</dd>
+ <dt>{{domxref("HTMLElement.draggable")}}</dt>
+ <dd>Is a {{jsxref("Boolean")}} indicating if the element can be dragged.</dd>
+ <dt>{{domxref("HTMLElement.dropzone")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("DOMSettableTokenList")}} reflecting the <code>dropzone</code> global attribute and describing the behavior of the element regarding a drop operation.</dd>
+ <dt>{{domxref("HTMLElement.hidden")}}</dt>
+ <dd>Is a {{jsxref("Boolean")}} indicating if the element is hidden or not.</dd>
+ <dt>{{domxref("HTMLElement.itemScope")}} {{experimental_inline}}</dt>
+ <dd>Is a {{jsxref("Boolean")}}…</dd>
+ <dt>{{domxref("HTMLElement.itemType")}} {{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a {{domxref("DOMSettableTokenList")}}…</dd>
+ <dt>{{domxref("HTMLElement.itemId")}} {{experimental_inline}}</dt>
+ <dd>Is a {{domxref("DOMString")}}…</dd>
+ <dt>{{domxref("HTMLElement.itemRef")}} {{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a {{domxref("DOMSettableTokenList")}}…</dd>
+ <dt>{{domxref("HTMLElement.itemProp")}} {{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a {{domxref("DOMSettableTokenList")}}…</dd>
+ <dt>{{domxref("HTMLElement.itemValue")}} {{experimental_inline}}</dt>
+ <dd>Returns an {{jsxref("Object")}}…</dd>
+ <dt>{{domxref("HTMLElement.lang")}}</dt>
+ <dd>Is a {{domxref("DOMString")}} representing the language of an element's attributes, text, and element contents.</dd>
+ <dt>{{domxref("HTMLElement.offsetHeight")}} {{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a <code>double</code> containing the height of an element, relative to the layout.</dd>
+ <dt>{{domxref("HTMLElement.offsetLeft")}}{{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a <code>double</code>, the distance from this element's left border to its <code>offsetParent</code>'s left border.</dd>
+ <dt>{{domxref("HTMLElement.offsetParent")}}{{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns an {{domxref("Element")}} that is the element from which all offset calculations are currently computed.</dd>
+ <dt>{{domxref("HTMLElement.offsetTop")}}{{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a <code>double</code>, the distance from this element's top border to its <code>offsetParent</code>'s top border.</dd>
+ <dt>{{domxref("HTMLElement.offsetWidth")}}{{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns a <code>double</code> containing the width of an element, relative to the layout.</dd>
+ <dt>{{domxref("HTMLElement.properties")}} {{readonlyInline}}{{experimental_inline}}</dt>
+ <dd>Returns an {{domxref("HTMLPropertiesCollection")}}…</dd>
+ <dt>{{domxref("HTMLElement.spellcheck")}}{{ gecko_minversion_inline("1.9")}}</dt>
+ <dd>Is a {{jsxref("Boolean")}} that controls <a href="/en-US/docs/HTML/Controlling_spell_checking_in_HTML_forms" title="en/Controlling_spell_checking_in_HTML_forms">spell-checking</a>. It is present on all HTML elements, though it hasn't an effect on all of them.</dd>
+ <dt>{{domxref("HTMLElement.style")}}</dt>
+ <dd>Is {{domxref("CSSStyleDeclaration")}}, an object representing the declarations of an element's style attributes.</dd>
+ <dt>{{domxref("HTMLElement.tabIndex")}}</dt>
+ <dd>Is a <code>long</code> representing the position of the element in the tabbing order.</dd>
+ <dt>{{domxref("HTMLElement.title")}}</dt>
+ <dd>Is a {{domxref("DOMString")}} containing the text that appears in a popup box when mouse is over the element.</dd>
+ <dt>{{domxref("HTMLElement.translate")}} {{experimental_inline}}</dt>
+ <dd>Is a {{jsxref("Boolean")}}</dd>
+</dl>
+
+<h3 id="Event_handlers">Event handlers</h3>
+
+<p>Most events properties, of the form <code>onXYZ</code>, are defined on the {{domxref("GlobalEventHandlers")}} or {{domxref("TouchEventHandlers")}}, implemented by <code>HTMLElement</code>. A few more are specific to <code>HTMLElement</code>.</p>
+
+<dl>
+ <dt>{{ domxref("HTMLElement.oncopy") }} {{ non-standard_inline() }}</dt>
+ <dd>Returns the event handling code for the <code>copy</code> event ({{bug("280959")}}).</dd>
+ <dt>{{ domxref("HTMLElement.oncut") }} {{ non-standard_inline() }}</dt>
+ <dd>Returns the event handling code for the <code>cut</code> event ({{bug("280959")}}).</dd>
+ <dt>{{ domxref("HTMLElement.onpaste") }} {{ non-standard_inline() }}</dt>
+ <dd>Returns the event handling code for the <code>paste</code> event ({{bug("280959")}}).</dd>
+ <dt>{{domxref("TouchEventHandlers.ontouchstart")}} {{non-standard_inline}}</dt>
+ <dd>Returns the event handling code for the {{event("touchstart")}} event.</dd>
+ <dt>{{domxref("TouchEventHandlers.ontouchend")}} {{non-standard_inline}}</dt>
+ <dd>Returns the event handling code for the {{event("touchend")}} event.</dd>
+ <dt>{{domxref("TouchEventHandlers.ontouchmove")}} {{non-standard_inline}}</dt>
+ <dd>Returns the event handling code for the {{event("touchmove")}} event.</dd>
+ <dt>{{domxref("TouchEventHandlers.ontouchenter")}} {{non-standard_inline}}</dt>
+ <dd>Returns the event handling code for the {{event("touchenter")}} event.</dd>
+ <dt>{{domxref("TouchEventHandlers.ontouchleave")}} {{non-standard_inline}}</dt>
+ <dd>Returns the event handling code for the {{event("touchleave")}} event.</dd>
+ <dt>{{domxref("TouchEventHandlers.ontouchcancel")}} {{non-standard_inline}}</dt>
+ <dd>Returns the event handling code for the {{event("touchcancel")}} event.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<p><em>Inherits methods from its parent, {{domxref("Element")}}.</em></p>
+
+<dl>
+ <dt>{{domxref("HTMLElement.blur()")}}</dt>
+ <dd>Removes keyboard focus from the currently focused element.</dd>
+ <dt>{{domxref("HTMLElement.click()")}}</dt>
+ <dd>Sends a mouse click event to the element.</dd>
+ <dt>{{domxref("HTMLElement.focus()")}}</dt>
+ <dd>Makes the element the current keyboard focus.</dd>
+ <dt>{{domxref("HTMLElement.forceSpellCheck()")}} {{experimental_inline}}</dt>
+ <dd>Makes the spell checker runs on the element.</dd>
+</dl>
+
+<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('CSSOM View', '#extensions-to-the-htmlelement-interface', 'HTMLElement')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Added the following properties: <code>offsetParent</code>, <code>offsetTop</code>, <code>offsetLeft</code>, <code>offsetWidth</code>, and <code>offsetHeight</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'elements.html#htmlelement', 'HTMLElement')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Added the following properties: <code>translate</code>, <code>itemScope</code>, <code>itemType</code>, <code>itemId</code>, <code>itemRef</code>, <code>itemProp</code>, <code>properties</code>, and <code>itemValue</code>.<br>
+    Added the following method: <code>forceSpellcheck()</code>.<br>
+    Moved the <code>onXYZ</code> attributes to the {{domxref("GlobalEventHandlers")}} interface and added an inheritance from it.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'dom.html#htmlelement', 'HTMLElement')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Added the following properties: <code>dataset</code>, <code>hidden</code>, <code>tabindex</code>, <code>accessKey</code>, <code>accessKeyLabel</code>, <code>draggable</code>, <code>dropzone</code>, <code>contentEditable</code>, <code>isContentEditable</code>, <code>contextMenu</code>, <code>spellcheck</code>, <code>commandType</code>, <code>commandLabel</code>, <code>commandIcon</code>, <code>commandHidden</code>, <code>commandDisabled</code>, <code>commandChecked</code>, <code>style</code>, and all the <code>onXYZ</code> properties.<br>
+    Moved the <code>id</code> and <code>className</code> properties to the {{domxref("Element")}} interface.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 HTML', 'html.html#ID-011100101', 'HTMLElement')}}</td>
+   <td>{{Spec2('DOM2 HTML')}}</td>
+   <td>No change from {{SpecName('DOM2 HTML')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM1', 'level-one-html.html#ID-011100101', 'HTMLElement')}}</td>
+   <td>{{Spec2('DOM1')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>9</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.accessKey", "accessKey")}}</td>
+   <td>{{CompatGeckoDesktop("5.0")}}</td>
+   <td>17.0</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}(<a class="external" href="http://trac.webkit.org/changeset/107483">535.10</a>)</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.accessKeyLabel", "accessKeyLabel")}}</td>
+   <td>{{CompatGeckoDesktop("8.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}{{WebkitBug(72715)}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.blur()", "blur()")}}</td>
+   <td>{{CompatGeckoDesktop("5.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.click()", "click()")}}</td>
+   <td>{{CompatGeckoDesktop("5.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}(<a class="external" href="http://trac.webkit.org/changeset/107483">535.24</a>)</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.dataset", "dataset")}}</td>
+   <td>{{CompatGeckoDesktop("6.0")}}</td>
+   <td>9.0</td>
+   <td>{{CompatUnknown}}</td>
+   <td>11.10</td>
+   <td>5.1</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.focus()", "focus()")}}</td>
+   <td>{{CompatGeckoDesktop("5.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.contentEditable", "contentEditable")}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>5.5</td>
+   <td>9</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.spellcheck", "spellcheck")}}</td>
+   <td>{{CompatGeckoDesktop("1.8.1")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.style", "style")}}</td>
+   <td>{{CompatVersionUnknown}} (returns a {{domxref("CSS2Properties")}}, rather than a {{domxref("CSSStyleDeclaration")}})</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.forceSpellCheck", "forceSpellCheck()")}} {{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.dataset", "dataset")}}</td>
+   <td>{{CompatGeckoDesktop("6.0")}}</td>
+   <td>8.0</td>
+   <td>11</td>
+   <td>11.10</td>
+   <td>6</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.draggable", "draggable")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>12.0</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.dropzone", "dropzone")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>12.0</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.offsetLeft", "offsetLeft")}}, {{domxref("HTMLElement.offsetTop", "offsetTop")}}, {{domxref("HTMLElement.offsetParent", "offsetParent")}}, {{domxref("HTMLElement.offsetHeight", "offsetHeight")}} and {{domxref("HTMLElement.offsetWidth", "offsetWidth")}} {{experimental_inline}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.translate", "translate")}} {{experimental_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.itemScope", "itemScope")}}, {{domxref("HTMLElement.itemType", "itemType")}}, {{domxref("HTMLElement.itemRef", "itemRef")}}, {{domxref("HTMLElement.itemId", "itemId")}}, {{domxref("HTMLElement.itemProp", "itemProp")}}, and {{domxref("HTMLElement.itemValue", "itemValue")}} {{experimental_inline}}</td>
+   <td>{{CompatGeckoDesktop("6.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>11.60<br>
+    (Removed in Opera 15)</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.properties", "properties")}} {{experimental_inline}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.ontouchstart")}}, {{domxref("HTMLElement.ontouchend")}}, {{domxref("HTMLElement.ontouchmove")}}, {{domxref("HTMLElement.ontouchenter")}}, {{domxref("HTMLElement.ontouchleave")}}, and {{domxref("HTMLElement.ontouchcancel")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.oncopy")}}, {{domxref("HTMLElement.oncut")}}, and {{domxref("HTMLElement.onpaste")}} {{Non-standard_inline}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>
+    <p>{{CompatGeckoMobile("1.0")}}</p>
+   </td>
+   <td rowspan="7">{{CompatUnknown}}</td>
+   <td rowspan="7">{{CompatUnknown}}</td>
+   <td rowspan="7">{{CompatUnknown}}</td>
+   <td rowspan="7">{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.accessKey", "accessKey")}}</td>
+   <td>{{CompatGeckoMobile("5.0")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.accessKeyLabel", "accessKeyLabel")}}</td>
+   <td>{{CompatGeckoMobile("8.0")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.blur()", "blur()")}}</td>
+   <td>{{CompatGeckoMobile("5.0")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.click()", "click()")}}</td>
+   <td>{{CompatGeckoMobile("5.0")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.dataset", "dataset")}}</td>
+   <td>{{CompatGeckoMobile("6.0")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.focus()", "focus()")}}</td>
+   <td>{{CompatGeckoMobile("5.0")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("HTMLElement.oncopy")}}, {{domxref("HTMLElement.oncut")}}, and {{domxref("HTMLElement.onpaste")}} {{Non-standard_inline}}</td>
+   <td>{{CompatGeckoMobile("1.9")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Element")}}</li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/nonce/index.html b/files/ru/web/api/htmlelement/nonce/index.html
new file mode 100644
index 0000000000..e47f3aea23
--- /dev/null
+++ b/files/ru/web/api/htmlelement/nonce/index.html
@@ -0,0 +1,44 @@
+---
+title: HTMLElement.nonce
+slug: Web/API/HTMLElement/nonce
+translation_of: Web/API/HTMLOrForeignElement/nonce
+---
+<p>{{SeeCompatTable}}{{APIRef("HTML DOM")}}</p>
+
+<p>Свойство <strong><code>nonce</code></strong> интерфейса {{domxref("HTMLElement")}} возвращает криптографический номер, который используется политикой безопасности содержимого для определения того, будет ли разрешена дальнейшая работа с данной выборкой.</p>
+
+<p>В более поздних реализациях элементы, имеющие атрибут nonce, предоставляют его только скриптам (а не сторонним каналам, таким как селекторы атрибутов CSS).</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <em>nonce</em> = HTMLElement.nonce
+HTMLElement.nonce = <em>nonce</em></pre>
+
+<h3 id="Value">Value</h3>
+
+<p>Криптографический код.</p>
+
+<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','#attr-nonce','nonce')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Первоначальное определение.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Compatibility">Browser Compatibility</h2>
+
+<div>
+<div class="hidden">Таблица совместимости на этой странице создается из структурированных данных. Если вы хотите внести свой вклад в данные, пожалуйста, проверьте <a href="/en-US/docs/">https://github.com/mdn/browser-compat-data</a> и отправьте нам запрос.</div>
+
+<p>{{Compat("api.HTMLElement.nonce")}}</p>
+</div>
diff --git a/files/ru/web/api/htmlelement/offsetheight/index.html b/files/ru/web/api/htmlelement/offsetheight/index.html
new file mode 100644
index 0000000000..e8d14948a9
--- /dev/null
+++ b/files/ru/web/api/htmlelement/offsetheight/index.html
@@ -0,0 +1,71 @@
+---
+title: HTMLElement.offsetHeight
+slug: Web/API/HTMLElement/offsetHeight
+translation_of: Web/API/HTMLElement/offsetHeight
+---
+<div>{{ APIRef("HTML DOM") }}</div>
+
+<p><strong><code>HTMLElement.offsetHeight</code></strong> - высота элемента с учетом вертикальных полей и границ в пикселях. Свойство неизменяемое, только для чтения. Возвращаемое значение - целочисленное.</p>
+
+<p>Typically, an element's <code>offsetHeight</code> is a measurement which includes the element borders, the element vertical padding, the element horizontal scrollbar (if present, if rendered) and the element CSS height.</p>
+
+<p>For the document body object, the measurement includes total linear content height instead of the element CSS height. Floated elements extending below other linear content are ignored.</p>
+
+<div class="note">
+<p>This property will round the value to an integer. If you need a fractional value, use {{ domxref("element.getBoundingClientRect()") }}.</p>
+</div>
+
+<h2 id="Syntax_and_values" name="Syntax_and_values">Syntax</h2>
+
+<pre class="eval">var <em>intElemOffsetHeight</em> = document.getElementById(<em>id_attribute_value</em>).offsetHeight;
+</pre>
+
+<p><em>intElemOffsetHeight</em> is a variable storing an integer corresponding to the offsetHeight pixel value of the element. The offsetHeight property is readonly.</p>
+
+<h2 id="Example" name="Example">Example</h2>
+
+<p> </p>
+
+<p>              <img alt="Image:Dimensions-offset.png" class="internal" src="/@api/deki/files/186/=Dimensions-offset.png"></p>
+
+
+<p>The example image above shows a scrollbar and an offsetHeight which fits on the window. However, non-scrollable elements may have large offsetHeight values, much larger than the visible content. These elements are typically contained within scrollable elements; consequently these non-scrollable elements may be completely or partly invisible, depending on the scrollTop setting of the scrollable container.</p>
+
+<p> </p>
+
+<h2 id="Specification" name="Specification">Specification</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('CSSOM View', '#dom-htmlelement-offsetHeight', 'offsetLeft')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Notes" name="Notes">Notes</h3>
+
+<p><code>offsetHeight</code> is a property of the DHTML object model which was first introduced by MSIE. It is sometimes referred to as an element's physical/graphical dimensions, or an element's border-box height.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{Compat("api.HTMLElement.offsetHeight")}}</p>
+
+<h2 id="See_Also" name="See_Also">See Also</h2>
+
+<ul>
+ <li>{{domxref("Element.clientHeight")}}</li>
+ <li>{{domxref("Element.scrollHeight")}}</li>
+ <li>{{domxref("HTMLElement.offsetWidth")}}</li>
+ <li><a href="/en-US/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements" title="en/Determining_the_dimensions_of_elements">Determining the dimensions of elements</a></li>
+ <li><a href="https://docs.microsoft.com/en-us/previous-versions//hh781509(v=vs.85)">MSDN Measuring Element Dimension and Location</a></li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/offsetleft/index.html b/files/ru/web/api/htmlelement/offsetleft/index.html
new file mode 100644
index 0000000000..ded2335950
--- /dev/null
+++ b/files/ru/web/api/htmlelement/offsetleft/index.html
@@ -0,0 +1,81 @@
+---
+title: HTMLElement.offsetLeft
+slug: Web/API/HTMLElement/offsetLeft
+translation_of: Web/API/HTMLElement/offsetLeft
+---
+<div>{{ APIRef("HTML DOM") }}</div>
+
+<p>Свойство <strong>offsetLeft</strong> содержит левое смещение элемента относительно offsetParent. Содержит расстояние от offsetParent до границы элемента.</p>
+
+<p>For block-level elements, <code>offsetTop</code>, <code>offsetLeft</code>, <code>offsetWidth</code>, and <code>offsetHeight</code> describe the border box of an element relative to the <code>offsetParent</code>.</p>
+
+<p>However, for inline-level elements (such as <strong>span</strong>) that can wrap from one line to the next, <code>offsetTop</code> and <code>offsetLeft</code> describe the positions of the <em>first</em> border box (use {{domxref("Element.getClientRects()")}} to get its width and height), while <code>offsetWidth</code> and <code>offsetHeight</code> describe the dimensions of the <em>bounding</em> border box (use {{domxref("Element.getBoundingClientRect()")}} to get its position). Therefore, a box with the left, top, width and height of <code>offsetLeft</code>, <code>offsetTop</code>, <code>offsetWidth</code> and <code>offsetHeight</code> will not be a bounding box for a span with wrapped text.</p>
+
+<h2 id="Syntax" name="Syntax">Syntax</h2>
+
+<pre class="eval notranslate"><var>left</var> = <var>element</var>.offsetLeft;
+</pre>
+
+<p><code><var>left</var></code> is an integer representing the offset to the left in pixels <em>from the closest relatively positioned</em> parent element.</p>
+
+<h2 id="Example" name="Example">Example</h2>
+
+<pre class="brush: js notranslate">var colorTable = document.getElementById("t1");
+var tOLeft = colorTable.offsetLeft;
+
+if (tOLeft &gt; 5) {
+  // large left offset: do something here
+}
+</pre>
+
+<p>This example shows a 'long' sentence that wraps within a div with a blue border, and a red box that one might think should describe the boundaries of the span.</p>
+
+<p><img alt="Image:offsetLeft.jpg" class="internal" src="/@api/deki/files/790/=OffsetLeft.jpg"></p>
+
+<pre class="brush: html notranslate">&lt;div style="width: 300px; border-color:blue; border-style:solid; border-width:1;"&gt;
+  &lt;span&gt;Short span. &lt;/span&gt;
+  &lt;span id="longspan"&gt;Long span that wraps within this div.&lt;/span&gt;
+&lt;/div&gt;
+
+&lt;div id="box" style="position: absolute; border-color: red; border-width: 1; border-style: solid; z-index: 10"&gt;
+&lt;/div&gt;
+
+&lt;script type="text/javascript"&gt;
+  var box = document.getElementById("box");
+  var longspan = document.getElementById("longspan");
+  box.style.left = longspan.offsetLeft + document.body.scrollLeft + "px";
+  box.style.top = longspan.offsetTop + document.body.scrollTop + "px";
+  box.style.width = longspan.offsetWidth + "px";
+  box.style.height = longspan.offsetHeight<span style="line-height: normal;"> + "px"</span><span style="line-height: normal;">;
+</span><span style="line-height: normal;">&lt;/script&gt; </span></pre>
+
+<h2 id="Specification" name="Specification">Specification</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('CSSOM View', '#dom-htmlelement-offsetleft', 'offsetLeft')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.offsetLeft")}}</p>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("HTMLElement.offsetParent")}}, {{domxref("HTMLElement.offsetTop")}}, {{domxref("HTMLElement.offsetWidth")}}, {{domxref("HTMLElement.offsetHeight")}}</li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/offsettop/index.html b/files/ru/web/api/htmlelement/offsettop/index.html
new file mode 100644
index 0000000000..e001d4e951
--- /dev/null
+++ b/files/ru/web/api/htmlelement/offsettop/index.html
@@ -0,0 +1,56 @@
+---
+title: HTMLElement.offsetTop
+slug: Web/API/HTMLElement/offsetTop
+translation_of: Web/API/HTMLElement/offsetTop
+---
+<div>
+<div>{{ APIRef("HTML DOM") }}</div>
+</div>
+
+<p><strong><code>HTMLElement.offsetTop - </code></strong><code>свойство элемента доступно только для чтения,</code> возвращает расстояние текущего элемента по отношению к верхней части {{domxref("HTMLelement.offsetParent","offsetParent")}} узла.</p>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="syntaxbox"><var>topPos</var> = element.offsetTop;
+</pre>
+
+<h3 id="Parameters" name="Parameters">Параметры</h3>
+
+<ul>
+ <li><code>topPos</code> - <code>это количество пикселей на которые делается отступ сверху, отсносительно родительского элемента.</code></li>
+</ul>
+
+<h2 id="Example" name="Example">Пример</h2>
+
+<pre class="brush:js">var d = document.getElementById("div1");
+var topPos = d.offsetTop;
+
+if (topPos &gt; 10) {
+  // объект имеет отступ больше
+  // чем 10 пикселей относительно своего родителя
+}</pre>
+
+<h2 id="Specification" name="Specification">Спецификация</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('CSSOM View', '#dom-htmlelement-offsettop', 'offsetTop')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibility" name="Compatibility">Совместимость с браузерами</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.offsetTop")}}</p>
diff --git a/files/ru/web/api/htmlelement/offsetwidth/index.html b/files/ru/web/api/htmlelement/offsetwidth/index.html
new file mode 100644
index 0000000000..d39fed6fb1
--- /dev/null
+++ b/files/ru/web/api/htmlelement/offsetwidth/index.html
@@ -0,0 +1,65 @@
+---
+title: HTMLElement.offsetWidth
+slug: Web/API/HTMLElement/offsetWidth
+translation_of: Web/API/HTMLElement/offsetWidth
+---
+<div>{{ APIRef("HTML DOM") }}</div>
+
+<p>Свойство <code><strong>HTMLElement.offsetWidth</strong></code> возвращает ширину элемента. Как правило, <code>offsetWidth</code> — это значение, включающее горизонтальный отступ элемента, ширину вертикального скроллбара (если он есть) и CSS ширину.</p>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="syntaxbox">var<em> offsetWidth</em> = <em>element</em>.offsetWidth;
+</pre>
+
+<p><code>offsetWidth</code> — свойство только для чтения</p>
+
+<div class="note">
+<p>Это свойство возвращает целочисленное значение. Если вам требуется дробное значение, используйте {{ domxref("element.getBoundingClientRect()") }}.</p>
+</div>
+
+<p> </p>
+
+<h2 id="Example" name="Example">Пример</h2>
+
+<p> </p>
+
+<p>              <img alt="Image:Dimensions-offset.png" class="internal" src="/@api/deki/files/186/=Dimensions-offset.png"></p>
+
+
+<h2 id="Specification" name="Specification">Спецификация</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('CSSOM View', '#dom-htmlelement-offsetwidth', 'offsetWidth')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Notes" name="Notes">Примечание</h3>
+
+<p><code>offsetWidth — </code>свойство объектной модели <abbr title="Dynamic HyperText Markup Language">DHTML,</abbr> которое впервые было представлено в браузере MSIE. Его иногда называют физической/графической шириной или шириной блока элемента.</p>
+
+<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>
+
+<p>{{Compat("api.HTMLElement.offsetWidth")}}</p>
+
+<h2 id="See_also" name="See_also">Смотрите также</h2>
+
+<ul>
+ <li>{{domxref("Element.clientWidth")}}</li>
+ <li>{{domxref("Element.scrollWidth")}}</li>
+ <li><a href="/en-US/docs/Determining_the_dimensions_of_elements">Determining the dimensions of elements</a></li>
+</ul>
+
+<div class="noinclude"> </div>
diff --git a/files/ru/web/api/htmlelement/outertext/index.html b/files/ru/web/api/htmlelement/outertext/index.html
new file mode 100644
index 0000000000..27e46a5f77
--- /dev/null
+++ b/files/ru/web/api/htmlelement/outertext/index.html
@@ -0,0 +1,29 @@
+---
+title: HTMLElement.outerText
+slug: Web/API/HTMLElement/outerText
+translation_of: Web/API/HTMLElement/outerText
+---
+<div>{{APIRef("DOM")}} {{ Non-standard_header() }}</div>
+
+<p><strong><code>HTMLElement.outerText</code></strong> - нестандартное свойство. В качестве геттера возвращает то же значение, что и {{domxref("Node.innerText")}}. В качестве сеттера удаляет текущий элемент и вставляет вместо него указанный текст.</p>
+
+<h2 id="Пример">Пример</h2>
+
+<p><a href="http://stackoverflow.com/a/18481435">См. ответ на StackOverflow.</a></p>
+
+<h2 id="Спецификация">Спецификация</h2>
+
+<p>Не является частью какой-либо спецификации. Обсуждение стандарта: <a href="https://github.com/whatwg/html/issues/668">whatwg/html#668</a>.</p>
+
+<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.outerText")}}</p>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li>{{domxref("Node.innerText")}}</li>
+ <li>{{domxref("Element.outerHTML")}}</li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/pointerover_event/index.html b/files/ru/web/api/htmlelement/pointerover_event/index.html
new file mode 100644
index 0000000000..300dbfe89c
--- /dev/null
+++ b/files/ru/web/api/htmlelement/pointerover_event/index.html
@@ -0,0 +1,84 @@
+---
+title: 'HTMLElement: pointerover event'
+slug: Web/API/HTMLElement/pointerover_event
+translation_of: Web/API/HTMLElement/pointerover_event
+---
+<div>{{APIRef}}</div>
+
+<p>Событие <code>pointerover</code> когда указатель входит в границы элемента слушаюшего события.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">Bubbles</th>
+   <td>Yes</td>
+  </tr>
+  <tr>
+   <th scope="row">Cancelable</th>
+   <td>Yes</td>
+  </tr>
+  <tr>
+   <th scope="row">Interface</th>
+   <td>{{domxref("PointerEvent")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Event handler property</th>
+   <td><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onpointerover">onpointerover</a></code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Примеры">Примеры</h2>
+
+<p>С ипользованием <code>addEventListener()</code>:</p>
+
+<pre class="brush: js">const para = document.querySelector('p');
+
+para.addEventListener('pointerover', (event) =&gt; {
+  console.log('Pointer moved in');
+});</pre>
+
+<p>С использованием свойство элемента <code>onpointerover</code> :</p>
+
+<pre class="brush: js">const para = document.querySelector('p');
+
+para.onpointerover = (event) =&gt; {
+  console.log('Pointer moved in');
+};</pre>
+
+<h2 id="Спецификации">Спецификации</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Pointer Events', '#the-pointerover-event')}}</td>
+   <td>{{Spec2('Pointer Events')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Браузерная_совместимость">Браузерная совместимость</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.pointerover_event")}}</p>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/gotpointercapture_event">gotpointercapture</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/lostpointercapture_event">lostpointercapture</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointerenter_event">pointerenter</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointerdown_event">pointerdown</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointermove_event">pointermove</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointerup_event">pointerup</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointercancel_event">pointercancel</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointerout_event">pointerout</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLElement/pointerleave_event">pointerleave</a></code></li>
+ <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onpointerover">onpointerover</a></code> свойство-обработчик события</li>
+ <li>Событие на элементах <code>Document</code>: событие <code><a href="/en-US/docs/Web/API/Document/pointerover_event">pointerover</a></code></li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/style/index.html b/files/ru/web/api/htmlelement/style/index.html
new file mode 100644
index 0000000000..683bfa1101
--- /dev/null
+++ b/files/ru/web/api/htmlelement/style/index.html
@@ -0,0 +1,78 @@
+---
+title: HTMLElement.style
+slug: Web/API/HTMLElement/style
+tags:
+  - API
+  - HTML DOM
+  - HTMLElement
+  - NeedsBrowserAgnosticism
+  - NeedsBrowserCompatibility
+  - NeedsMarkupWork
+  - NeedsSpecTable
+  - Свойство
+  - Ссылки
+translation_of: Web/API/ElementCSSInlineStyle/style
+---
+<h2 id="Кратко">Кратко</h2>
+
+<div>
+<div>{{ APIRef("HTML DOM") }}</div>
+</div>
+
+<p>Свойство<strong> </strong><code><strong>HTMLElement.style</strong></code> используется для получения и установки инлайновых стилей. При получении возвращается объект <a href="/en-US/docs/DOM/CSSStyleDeclaration" title="DOM/CSSStyleDeclaration"><code>CSSStyleDeclaration</code></a> , который содержит список из всех свойств стилей для этого элемента с значениями заданными  для атрибутов , что определенны  в инлайновом стиле (см. <a href="/en-US/docs/Web/HTML/Global_attributes#style"><code>атрибут</code> стиля</a>) элемента. См. <a href="/en-US/docs/Web/CSS/CSS_Properties_Reference" title="/en-US/docs/Web/CSS/CSS_Properties_Reference">CSS Properties Reference</a> для получения списка CSS свойств применимых вместе со style.  </p>
+
+<h3 id="Настройка_стилей">Настройка стилей</h3>
+
+<p>Свойство style имеет тот же приоритет (и выше) в каскаде CSS как и прямая декларация стиля через атрибут style, полезен для настройки стиля отдельного специфичного элемента.</p>
+
+<p>Стили не следует устанавливать непосредственно через свойство <code>style</code> (например <code>elt.style = "color: blue;"</code>), поскольку оно считается доступным только для чтения и атрибут style возвращает объект <code>CSSStyleDeclaration</code> который доступен только для чтения. Вместо этого стили могут быть установлены путем присвоения значений свойствам <code>style</code>. Для добавления определенных стилей для элемента без изменения других свойств стилей предпочтительно использовать отдельные свойства <code>style</code> (например <code>elt.style.color = '...'</code>).
+При использовании <br><code>elt.style.cssText = '...'</code> или <code>elt.setAttribute('style','...')</code> устанавливаются стили перезаписывая уже существующие. Обратите внимание, что имена свойств стилей задаются в camel-case а не в kebab-case <code>elt.style.&lt;property&gt;</code> (т.е., <code>elt.style.fontSize</code>, а не <code>elt.style.font-size</code>).</p>
+
+<p>Объявленные стили сбрасываются присваиванием значения <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">null</span></font>, <br><code>elt.style.color = null</code></p>
+
+<h2 id="Example" name="Example">Примеры</h2>
+
+<pre><code>// Устанавливает несколько стилей в одном выражении
+elt.style.cssText = "color: blue; border: 1px solid black";
+// Или
+elt.setAttribute("style", "color:red; border: 1px solid blue;");
+
+// Устанавливает определенный стиль оставляя другие значения стиля нетронутыми
+elt.style.color = "blue";</code></pre>
+
+<h3 id="Получение_стиль-информации">Получение стиль-информации</h3>
+
+<p>Свойство <code>style</code> в основном не имеет пользы в части информации о стиле элемента, оно только олицетворяет собой набор CSS деклараций атрибутов style элемента, а не тех которые проистекают из стиль-правил откуда-либо ещё, таких как стилевые правила раздела {{HTMLElement("head")}}, или внешней таблицы стилей. Для получения значений всех CSS свойств элемента вы должны использовать вместо этого {{domxref("window.getComputedStyle()")}}.</p>
+
+<div style="overflow: hidden;">
+<pre class="brush:js">var div = document.getElementById("div1");
+div.style.marginTop = ".25in";</pre>
+</div>
+
+<p>Следующий код показывает имена всех свойств стиля, значений, заданных явно для элемента elt и унаследованных "расчитанных" значений:</p>
+
+<pre class="brush:js">var elt = document.getElementById("elementIdHere");
+var out = "";
+var st = elt.style;
+var cs = window.getComputedStyle(elt, null);
+for (x in st) {
+  out += "  " + x + " = '" + st[x] + "' &gt; '" + cs[x] + "'\n";
+}</pre>
+
+<h2 id="Specification" name="Specification">Спецификация</h2>
+
+<p><a href="http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-ElementCSSInlineStyle">DOM Level 2 Style: ElementCSSInlineStyle.style</a></p>
+
+<p><a href="https://www.w3.org/TR/cssom-1/#the-elementcssinlinestyle-interface">CSSOM: ElementCSSInlineStyle</a></p>
+
+<h2 id="Совместимость">Совместимость</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.style")}}</p>
+
+<h2 id="См._также">См. также</h2>
+
+<ul>
+ <li><a href="/en-US/docs/DOM/Using_dynamic_styling_information" title="DOM/Using dynamic styling information">Использование динамической стиль-информации</a></li>
+</ul>
diff --git a/files/ru/web/api/htmlelement/tabindex/index.html b/files/ru/web/api/htmlelement/tabindex/index.html
new file mode 100644
index 0000000000..fe41116fe4
--- /dev/null
+++ b/files/ru/web/api/htmlelement/tabindex/index.html
@@ -0,0 +1,134 @@
+---
+title: HTMLElement.tabIndex
+slug: Web/API/HTMLElement/tabIndex
+translation_of: Web/API/HTMLOrForeignElement/tabIndex
+---
+<div>
+<div>{{ APIRef("HTML DOM") }}</div>
+</div>
+
+<p>Свойство <code><strong>HTMLElement.tabIndex </strong>предоставляет</code> возможность вызова по кнопке Tab текущего элемента.</p>
+
+<div>
+<div>Вызов по табуляции происходит в следующем порядке:</div>
+
+<ol>
+ <li><span style="font-size: 14px; line-height: 1.5;">элементы с положительным tabIndex. <span style="font-size: 14px; line-height: 1.5;">Элементы, имеющие одинаковое значение tabIndex вызываются в порядке появления в коде.  <span style="font-size: 14px; line-height: 1.5;">Переход осуществляется от меньших tabIndex до больших tabIndex. </span></span></span></li>
+ <li><span style="font-size: 14px; line-height: 1.5;">Элементы, которые не поддерживают атрибут tabIndex или поддерживают но tabIndex установлен в "0", выбираются по Tab в порядке их появления в коде.</span></li>
+</ol>
+
+<div>Элементы для которых установлена блокировка (disabled) не могут быть выбраны кнопкой Tab и не могут быть в фокусе.</div>
+
+<div> </div>
+
+<div><span style="font-size: 14px; line-height: 1.5;">Значения могут начинаться с любого числа, могут быть отрицательными и могут быть непоследовательными, однако разные браузеры можгут неправильно сработать при очень больших значениях.</span></div>
+
+<div> </div>
+</div>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="syntaxbox"><em>elt</em>.tabIndex = <em>index</em>;
+var <em>index</em> = <em>elt</em>.tabIndex;
+</pre>
+
+<ul>
+ <li><em><var>index</var></em> - целое число</li>
+</ul>
+
+<h2 id="Example" name="Example">Пример</h2>
+
+<pre class="brush:js">var b1 = document.getElementById("button1");
+
+b1.tabIndex = 1;
+</pre>
+
+<h2 id="Specification" name="Specification">Спецификация</h2>
+
+<p> </p>
+
+<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', '#dom-tabindex', 'tabindex')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Не было изменений с {{SpecName('DOM2 HTML')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 HTML', 'html.html#ID-40676705', 'tabindex')}}</td>
+   <td>{{Spec2('DOM2 HTML')}}</td>
+   <td>Не было изменений с {{SpecName('DOM1')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM1', 'level-one-html.html#ID-40676705', 'tabindex')}}</td>
+   <td>{{Spec2('DOM1')}}</td>
+   <td>Начальное определение</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>Basic support</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>Basic support</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/Accessibility/Keyboard-navigable_JavaScript_widgets" title="Accessibility/Keyboard-navigable_JavaScript_widgets">Accessibility of keyboard-navigable JavaScript widgets</a></li>
+ <li>The HTML <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex"><strong>tabindex</strong></a> глобальный атрибут.</li>
+</ul>