recursal/MDN huggingface dataset:
<hgroup>
========

**Экспериментальная возможность:** **Это экспериментальная технология**  
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

**Примечание:** Этот элемент был удалён из HTML5 (W3C) спецификации , но до сих пор остаётся в спецификации WHATWG. Он частично встроен в большинство браузеров, хотя бы поэтому вряд ли уйдёт. Поскольку схематический алгоритм не реализован ни в одном браузере, семантика тега `<hgroup>` на практике реализована только теоретически. Спецификация HTML5 (W3C) даёт совет как обозначать подзаголовки, альтернативные заголовки и слоганы.

HTML <hgroup> Элемент (HTML Headings Group Element - Элемент Группы Заголовков HTML) представляет заголовок раздела. Он определяет один заголовок, который участвует в схеме документа как заголовок явно или неявно заданного раздела, к которому он принадлежит.

Собственно текст для схематического алгоритма - это текст первого элемента заголовка HTML наивысшего ранга (т. Е. Первый `<h1>` (en-US), `<h2>` (en-US),  h3 ,  h4 ,  h5  или  h6  с наименьшим числом потомков), а rank - уровень этого элемента заголовка HTML.

Поэтому этот элемент группирует несколько заголовков, внося лишь основной текст в план документа. Он позволяет связывать вторичные заголовки, такие как подзаголовки, альтернативные заголовки или даже теги, с основным заголовком, без загрязнения структуры документа.

| Категория информации | Flow content (en-US), heading content, palpable content. |
| --- | --- |
| Permitted content | One or more `<h1>` (en-US), `<h2>` (en-US), `<h3>` (en-US), `<h4>` (en-US), `<h5>` (en-US), and/or `<h6>` (en-US). |
| Tag omission | Нет, открывающий и закрывающий теги обязательны. |
| Permitted parent elements | Any element that accepts flow content (en-US). |
| DOM interface | `HTMLElement` |

Атрибуты
--------

This element only includes the global attributes (en-US).

Примеры
-------


```html
<hgroup>
  <h1>Главный заголовок</h1>
  <h2>Вторичный заголовок</h2>
</hgroup>
```

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Другие элементы, связанные с разделом: `<body>`, `<article>`, `<section>`, `<aside>`, `<h1>` (en-US), `<h2>` (en-US), `<h3>` (en-US), `<h4>` (en-US), `<h5>` (en-US), `<h6>` (en-US), `<nav>`, `<header>`, `<footer>`, `<address>`;
* Разделы и структура документа HTML5.
<map>
=====

\*\*HTML-элемент `<map>` \*\*используется с элементами `<area>` для определения карты изображения (интерактивной области ссылок).

Интерактивный пример
--------------------

| Категории контента (en-US) | Потоковый контент (en-US), фразовый контент (en-US), явный контент. |
| --- | --- |
| Допустимое содержимое | Любой прозрачный элемент. |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любые элементы, которые принимают фразовый контент (en-US). |
| Допустимые ARIA-роли | Нет |
| DOM-интерфейс | `HTMLMapElement` (en-US) |

Атрибуты
--------

Элемент включает глобальные атрибуты (en-US).

`name`

Атрибут name даёт карте имя, чтобы на неё можно было ссылаться. Атрибут должен быть определён и иметь не пустое значение без пробелов. Значение атрибута name не должно совпадать с регистром совместимости со значением атрибута name другого элемента карты в том же документе. Если также указан атрибут id, то они оба должны иметь одинаковое значение.

Пример
------


```html
<map name="primary">
  <area shape="circle" coords="75,75,75" href="left.html" />
  <area shape="circle" coords="275,75,75" href="right.html" />
</map>
<img usemap="#primary" src="https://placehold.it/350x150" alt="350 x 150 pic" />
```

Живой пример
------------

### Ожидаемые выходные данные

Живой пример выше должен выглядеть как нижеследующее изображение (при использовании клавиши на клавиатуре):

*Для ссылки `left.html`:*
![](/ru/docs/Web/HTML/Element/map/screen_shot_2017-02-02_at_10.48.40_pm.png)

*Для ссылки `right.html`:*
![](/ru/docs/Web/HTML/Element/map/screen_shot_2017-02-02_at_10.49.04_pm.png)

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-map-element |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* `<a>`
* `<area>`
<label>
=======

\*\*HTML-элемент `<label>` \*\*представляет собой подпись к элементу пользовательского интерфейса.

| Категории контента | Общий поток, текстовый контент, интерактивный контент, элемент формы, ощутимый контент. |
| --- | --- |
| Допустимый контент | Текстовый контент, но без вложенных элементов `label`. Недопустимы другие оборачиваемые в `label` элементы помимо целевого. |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, разрешающий текстовый контент. |
| Допустимые ARIA-роли | Нет |
| DOM-интерфейс | `HTMLLabelElement` (en-US) |

Атрибуты
--------

Элемент поддерживает глобальные атрибуты.

`for`

ID labelable-элемента, который находится в том же документе, что и элемент label. Первый такой элемент в документе, ID которого совпадает со значением атрибута `for`, становится `labeled-*` контролом для данного `label`.

**Примечание:** Элемент *label* может иметь как атрибут *for*, так и отдельный элемент управления, если атрибут *for* указывает на содержащийся элемент управления.

`form`

Элемент формы, с которым связан label (его владелец формы). Если указано, значением атрибута является идентификатор элемента `<form>` в том же документе. Это позволяет размещать элементы label в любом месте документа, а не только как потомки их элементов формы.

**Примечание:** Этот атрибут содержимого был удалён из спецификации HTML 28 апреля 2016 г. Однако сценарии по-прежнему имеют доступ только для чтения `HTMLLabelElement.form` (en-US); он возвращает форму, членом которой является связанный элемент управления label, или значение NULL, если label не связана с элементом управления или элемент управления не является частью формы.

Примечания по использованию
---------------------------

* <label> можно связать с элементом управления, поместив элемент управления внутри элемента <label> или используя атрибут `for`. Такой элемент управления называется помеченным элементом управления надписью. Один вход может быть связан с несколькими метками.
* Метки сами по себе не связаны с формами. Они только косвенно связаны с формами через элементы управления, с которыми они связаны.
Examples
--------

### Simple label example


```html
<label>Click me <input type="text" /></label>
```

### Using the "for" attribute


```html
<label for="username">Click me</label> <input type="text" id="username" />
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # the-label-element |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* Other form-related elements: `<form>`, `<input>`, `<button>`, `<datalist>`, `<legend>`, `<select>`, `<optgroup>`, `<option>`, `<textarea>` (en-US), `<fieldset>`, `<output>`, `<progress>` and `<meter>`.
<slot>
======

Baseline Widely available
-------------------------

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

* Learn more
* See full compatibility
* Report feedback
HTML-элемент `<slot>` является частью набора технологии Web Components, является заполнителем внутри веб компонента, который можно заполнить собственной разметкой, которая позволяет создавать отдельные деревья DOM и представлять их вместе.

| Категории контента | Поток контента, содержание формулировки |
| --- | --- |
| Допустимое содержимое | Прозрачный |
| События | `slotchange` |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, который принимаетсодержание формулировки |
| Допустимые ARIA-роли | Нет |
| DOM-интерфейс | `HTMLSlotElement` |

Атрибуты
--------

Этот элемент включает в себя глобальные атрибуты.

`name`

Название слота.***Именованный слот*** это элемент `<slot>` с атрибутом `name`.

Примеры
-------


```html
<template id="element-details-template">
  <style>
 details {
 font-family: "Open Sans Light", Helvetica, Arial, sans-serif;
 }
 .name {
 font-weight: bold;
 color: #217ac0;
 font-size: 120%;
 }
 h4 {
 margin: 10px 0 -8px 0;
 background: #217ac0;
 color: white;
 padding: 2px 6px;
 border: 1px solid #cee9f9;
 border-radius: 4px;
 }
 .attributes {
 margin-left: 22px;
 font-size: 90%;
 }
 .attributes p {
 margin-left: 16px;
 font-style: italic;
 }
 </style>
  <details>
    <summary>
      <code class="name"
 >&lt;<slot name="element-name">NEED NAME</slot>&gt;</code
 >
      <i class="desc"><slot name="description">NEED DESCRIPTION</slot></i>
    </summary>
    <div class="attributes">
      <h4>Attributes</h4>
      <slot name="attributes"><p>None</p></slot>
    </div>
  </details>
  <hr />
</template>
```


**Примечание:** вы можете увидеть этот полный пример в действии на странице element-details (смотрите его в режиме реального времени). Кроме того, вы можете найти в разделе Использование шаблонов и слотов (en-US).

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-slot-element |
| DOM Standard # shadow-tree-slots |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
<marquee>
=========

Определение
-----------

HTML-элемент `<marquee>` используется для создания на странице прокручивающегося текста (бегущей строки).

Атрибут
-------

`behavior`

Описывает поведение прокрутки. Допустимые значения: `scroll`, `slide` `и alternate`. Если значение не указано, то используется `scroll`.

`bgcolor`

Задаёт цвет фона (можно использовать имя цвета или шестнадцатеричное значение).

`direction`

Задаёт направление прокрутки. `Допустимые значения: left`, `right`, `up` и `down`. Если значение не указано, то используется `left`.

`height`

Задаёт высоту в пикселях или процентах.

`hspace`

Задаёт поле (margin) слева.

`loop`

Задаёт количество прокруток. Если значение не указано, то используется -1, что означает бесконечную прокрутку

`scrollamount`

Задаёт сдвиг на каждом шаге в пикселях. По умолчанию 6.

`scrolldelay`

Задаёт интервал между каждым шагом в миллисекундах. По умолчанию 85. Обратите внимание, что значения меньше 60 будут проигнорированы и будет использовано 60, если не присутствует атрибут `truespeed`.

`truespeed`

По умолчанию значения меньше 60 в `scrolldelay` игнорируются. Однако, если присутствует `truespeed`, то они не игнорируются

`vspace`

Задаёт вертикальный отступ (margin) в пикселях или процентах.

`width`

Задаёт ширину в пикселях или процентах.

Обработчики событий
-------------------

`onbounce`

Срабатывает, когда marquee достиг конечного состояния. Срабатывает только в случаях, когда `behavior` имеет значение `alternate`.

`onfinish`

Срабатывает, когда marquee прокрутился столько раз, сколько было задано в атрибуте `loop`. Срабатывает только тогда, когда атрибут `loop` имеет положительное значение.

`onstart`

Срабатывает в начале прокрутки.

Методы
------

start

Запускает прокрутку marquee.

stop

Останавливает прокрутку marquee.

Examples
--------


```html
<marquee>This text will scroll from right to left</marquee>

<marquee direction="up">This text will scroll from bottom to top</marquee>

<marquee
 direction="down"
 width="250"
 height="200"
 behavior="alternate"
 style="border:solid">
  <marquee behavior="alternate">This text will bounce</marquee>
</marquee>
```

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-marquee-element-2 |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
<header>
========

**HTML-элемент `<header>`** представляет собой вводный контент, обычно группу вводных или навигационных средств. Он может содержать другие элементы-заголовки, а также логотип, форму поиска, имя автора и другие элементы.

Интерактивный пример
--------------------

| Категории контента | Основной поток, явный контент. |
| --- | --- |
| Допустимое содержимое | Основной поток, кроме `<header>` и `<footer>` |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, который разрешает контент основного потока в качестве содержимого. Обратите внимание, что элемент `<header>` не должен быть потомком элемента `<address>`, `<footer>` или другого элемента `<header>`. |
| Допустимые ARIA-роли | `group (en-US)`, `presentation (en-US)` |
| DOM-интерфейс | `HTMLElement` |

Примечание
----------

Элемент `<header>` не относится к секционному контенту , а значит не создаёт новый раздел в структуре HTML-документа. При этом элемент `<header>` обычно должен содержать заголовок ближайшего раздела (элементы `h1`-`h6`), но это **не** обязательно.

### Историческое употребление

Несмотря на то, что элемент `<header>` не попал в спецификации до HTML5, на самом деле, он существовал с самого начала HTML. Первоначально, на самом первом веб-сайте он использовался как элемент `<head>`. В какой-то момент было принято решение использовать другое имя. Позже, это позволило `<header>` занять другую роль.

Атрибуты
--------

К этому элементу применимы только глобальные атрибуты.

Примеры
-------

### Заголовок страницы


```html
<header>
  <h1>Заголовок главной страницы</h1>
  <img src="mdn-logo-sm.png" alt="MDN logo" />
</header>
```

### Заголовок статьи


```html
<article>
  <header>
    <h2>Планета Земля</h2>
    <p>Опубликовано в среду, 4 октября 2017, Джейн Смит</p>
  </header>
  <p>
    Мы живём на сине-зелёной планете, на которой до сих пор так много
    неизведанного.
  </p>
  <p>
    <a href="https://janesmith.com/the-planet-earth/">Продолжить чтение...</a>
  </p>
</article>
```

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-header-element |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Связанные с этим разделом элементы: `<body>`, `<nav>`, `<article>`, `<aside>`, `<h1>` (en-US), `<h2>` (en-US), `<h3>` (en-US), `<h4>` (en-US), `<h5>` (en-US), `<h6>` (en-US), `<hgroup>`, `<footer>`, `<section>`, `<address>`.
* Разделы и структура документа HTML5.
<nav> - элемент навигации
=========================

**HTML-элемент `<nav>`** определяет отдельную секцию документа, назначение которой обозначение ссылок навигации (как внутри текущего документа, так и ведущих на другую страницу). В качестве примера такой секции можно привести меню, якорные ссылки.

| Категории контента | Потоковый контент, секционный контент, явный контент. |
| --- | --- |
| Допустимое содержимое | Потоковый контент. |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, содержащий потоковый контент. |
| Допустимые ARIA-роли | Нет |
| DOM-интерфейс | `HTMLElement` |

Атрибуты
--------

Этот элемент поддерживает глобальные атрибуты.

Примечание
----------

* Не обязательно все ссылки должны быть обёрнуты в `<nav>`. `<nav>` следует использовать лишь для главных навигационных блоков. Например, `<footer>` часто содержит список ссылок, которые не стоит оборачивать в `<nav>` .
* Документ может содержать несколько `<nav>` элементов. Например, один для навигации по сайту, второй для навигации по странице.
* Пользовательские агенты, такие как устройства чтения с экрана, предназначенные для людей с плохим зрением, могут использовать этот элемент, чтобы определить следует ли пускать рендеринг содержимого навигации.
Примеры
-------

В данном примере, блок `<nav>` содержит ненумерованный список (`<ul>`) ссылок. С помощью CSS данный блок можно использовать как сайдбар, навигационную колонку или выпадающее меню.


```html
<nav class="menu">
  <ul>
    <li><a href="#">Главная</a></li>
    <li><a href="#">О нас</a></li>
    <li><a href="#">Контакты</a></li>
  </ul>
</nav>
```

Спецификация
------------

| Specification |
| --- |
| HTML Standard # the-nav-element |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Другие секционные элементы: `<body>`, `<article>`, `<section>`, `<aside>`, `<h1>` (en-US), `<h2>` (en-US), `<h3>` (en-US), `<h4>` (en-US), `<h5>` (en-US), `<h6>` (en-US), `<hgroup>`, `<header>`, `<footer>`, `<address>`;
* Разделы и структура документа HTML5.
<input type="tel">
==================

Элементы `<input>` с типом **`tel`** используются для ввода телефонных номеров. В отличие от `<input/email>` (en-US) и `<input/url>` (en-US) вводимое значение не проходит автоматическую валидацию перед отправкой формы, поскольку форматы телефонных номеров сильно различаются по всему миру.

Интерактивный пример
--------------------

Несмотря на то, что поля ввода `tel` функционально идентичны обычным полям ввода с типом `text`, они приносят пользу: например, браузеры мобильных телефонов могут предоставлять для таких полей специальную клавиатуру, оптимизированную для ввода телефонных номеров. Использование специального поля ввода для телефонных номеров также упрощает реализацию их проверки и обработки.

**Примечание:** Браузеры, не поддерживающие тип `tel`, будут отображать обычное поле ввода `<input/text>` (en-US).

Значение
--------

Атрибут `value` элемента `<input>` содержит строку, которая представляет номер телефона либо является пустой строкой (`""`).

Спецификации
------------

| Specification |
| --- |
| HTML Standard # telephone-state-(type=tel) |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Руководство по HTML-формам
* `<input>`
    + `<input/text>` (en-US)
    + `<input/email>` (en-US)
* Compatibility of CSS properties (en-US)
CORS settings attributes
========================

В HTML5 некоторые теги поддерживают CORS (en-US), например `<img>` или `<video>`, имеют атрибут `crossorigin` (`crossOrigin` свойство), которое позволяет настроить CORS запросы для данных получаемых элементом. Эти атрибуты могут иметь следующие значения:

| Ключевое слово | Описание |
| --- | --- |
| `anonymous` | CORS запросы от этого элемента не будут передавать учётные данные. |
| `use-credentials` | CORS запросы от этого элемента будут передавать учётные данные. |

По умолчанию (если значение атрибута не задано), CORS не используется вообще. Ключевое слово "anonymous" означает что не будет обмена **учётных данных**(user credentials) через cookies, client-side SSL сертификаты или HTTP аутентификацию как описано в Секции Терминология CORS спецификации.

Неправильное ключевое слово или пустая строка, будет обработано как `anonymous`.

### Пример: crossorigin с тегом script

Используя тег `<script>` вы можете указать браузеру выполнять код `https://example.com/example-framework.js` без передачи user-credentials.


```html
<script
 src="https://example.com/example-framework.js"
 crossorigin="anonymous"></script>
```

Спецификации
------------

| Specification |
| --- |
| HTML Standard # cors-settings-attributes |

Совместимость с браузерами
--------------------------

### html.elements.img.crossorigin

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### html.elements.link.crossorigin

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### html.elements.script.crossorigin

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### html.elements.video.crossorigin

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* HTTP access control
Псевдоэлементы
==============

**Псевдоэлемент** в CSS — *это ключевое слово, добавляемое к селектору,* которое позволяет стилизовать определённую часть выбранного элемента. Например, псевдоэлемент `::first-line` может быть использован для изменения шрифта первой строки абзаца.


```css
/\* Первая строка каждого элемента <p>. \*/
p::first-line {
  color: blue;
  text-transform: uppercase;
}
```


**Примечание:** В отличие от псевдоэлементов, псевдоклассы могут быть использованы для стилизации элемента на основе его *состояния*.

Синтаксис
---------
```

selector::pseudo-element {
  property: value;
}
```


В селекторе можно использовать только один псевдоэлемент. Он должен находиться после простых селекторов в выражении.

**Примечание:** Как правило, следует использовать двойное двоеточие (`::`) вместо одинарного (`:`). В этом состоит различие между псевдоклассами и псевдоэлементами. Однако, так как это различие не присутствовало в старых версиях спецификации W3C, большинство браузеров поддерживают оба синтаксиса для псевдоэлементов.

Список стандартных псевдоэлементов
----------------------------------

* `::after`
* `::before`
* `::cue`
* `::first-letter`
* `::first-line`
* `::selection`
* `::slotted`
* `::backdrop` 
Экспериментальная возможность
* `::placeholder` 
Экспериментальная возможность
* `::marker` 
Экспериментальная возможность
* `::spelling-error` (en-US) 
Экспериментальная возможность
* `::grammar-error` 
Экспериментальная возможность

| Браузер | Начиная с версии | Поддерживает |
| --- | --- | --- |
| Internet Explorer | 8.0 | `:pseudo-element` |
| 9.0 | `:pseudo-element ::pseudo-element` |
| Firefox (Gecko) | 1.0 (1.0) | `:pseudo-element` |
| 1.0 (1.5) | `:pseudo-element ::pseudo-element` |
| Opera | 4.0 | `:pseudo-element` |
| 7.0 | `:pseudo-element ::pseudo-element` |
| Safari (WebKit) | 1.0 (85) | `:pseudo-element ::pseudo-element` |

Смотрите также
--------------

* Псевдоклассы
line-break
==========

CSS-свойство **`line-break`** устанавливает способ разрыва строки текста на китайском, японском или корейском (CJK) при работе с пунктуацией и символами.


```css
/\* Ключевые слова \*/
line-break: auto;
line-break: loose;
line-break: normal;
line-break: strict;

/\* Глобальные значения \*/
line-break: inherit;
line-break: initial;
line-break: unset;
```


|  |  |
| --- | --- |
| Начальное значение | `auto` |
| Применяется к | все элементы |
| Наследуется | да |
| Обработка значения | как указано |
| Animation type | discrete |

Синтаксис
---------

### Значения

`auto`

Разрыв текста, используя правило разрыва строки по умолчанию.

`loose`

Разрыв текста, используя правило разрыва строки с наименьшими ограничениями. Обычно используется для коротких строк, например, в газетах.

`normal`

Разрыв текста, используя наиболее распространённое правило разрыва строки.

`strict`

Разрыв текста, используя самое строгое правило разрыва строки.

### Формальный синтаксис
```

line-break =   
  auto      | (en-US)  
  loose     | (en-US)  
  normal    | (en-US)  
  strict    | (en-US)  
  anywhere    
  
```

Спецификации
------------

| Specification |
| --- |
| CSS Text Module Level 3 # line-break-property |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
CSS Ruby Layout
===============

CSS Ruby Layout - это модуль CSS, который предоставляет модель рендеринга и элементы управления форматированием, связанные с отображением аннотации ruby. Рубиновая аннотация - это форма межлинейной аннотации, состоящая из коротких строк текста наряду с базовым текстом. Они обычно используются в восточноазиатских документах для обозначения произношения или для краткой аннотации.

Reference
---------

### CSS properties

* `ruby-align`
* `ruby-position` (en-US)
Guides
------

*None.*

Specifications
--------------

| Specification |
| --- |
| CSS Ruby Annotation Layout Module Level 1  |