HTML5 Flashcards
<main>
</main>
(главная, основной)
HTML5. Элемент <main> предназначен для основного содержимого документа. Содержимое должно быть уникальным и не включать типовые блоки вроде шапки сайта, подвала, навигации, боковой панели, формы поиска и т. п.
<body>
<h1>Следы невиданных зверей</h1>
<main>
История о том, как возле столовой появились загадочные розовые
следы с шестью пальцами, и почему это случилось.
</main>
</body>
<bdi>Текст</bdi>
HTML5. Элемент <bdi> указывает фрагмент текста, который должен быть изолирован от изменения направления вывода текста. Такое поведение важно для текстов, одновременно содержащих разные языки, читающихся слева направо и справа налево.</bdi>
<body>
<p><bdi>שבת</bdi> — суббота</p>
<p>В ашкеназском произношении звучит как «ша́бос» (идиш «ша́бес»),
а в сефардском — как «шаба́т».</p>
</body>
“<command></command>”
<menu>
<command></command>
</menu>
HTML5. Создает команду в виде переключателя, флажка или обычной кнопки. Тег <command></command> должен располагаться внутри <menu>, в противном случае он не будет показан.
<body>
<menu>
<command></command>
<command></command>
<command></command>
</menu>
</body>
<meter>текст</meter>
(счетчик, измеритель)
HTML5. Используется для вывода значения в некотором известном диапазоне. Используется преимущественно для отображения числовых значений, например, количества результатов поиска, объема жидкости, давления и др.
<body>
<p>Температура воды</p>
<meter>Низкая</meter>
<meter>Нормальная</meter>
<meter>Горячая</meter>
<meter>Кипяток</meter>
</body>
“datalist id=”<идентификатор>"></datalist>"</идентификатор>
(список данных)
<input></input>
<datalist>
<option>
<option>
</datalist>
</option></option></datalist>
HTML5. Создает список вариантов, которые можно выбирать при наборе в текстовом поле. Изначально этот список скрыт и становится доступным при получении полем фокуса или наборе текста.
<p>Выберите любимого персонажа:</p>
<p><input></input>
<datalist>
<option></option>
<option></option>
<option></option>
</datalist></p>
“<time>дата и время</time>”
<time>дата и время</time>
<time>текст</time>
HTML5. Помечает текст внутри тега <time> как дата, время или оба значения. Может указываться непосредственно внутри контейнера <time>, либо задаваться через атрибут datetime.</time></time>
<body>
<article>
<p><time>1957-10-04</time> запущен первый искусственный спутник Земли.</p>
<p><time>1960-08-19</time> первый полет собак в космос.</p>
<p><time>1961-04-12</time> первый полет человека в космос.</p>
<p><time>1963-06-16</time> первый полет женщины-космонавта.</p>
<p><time>1969-07-21</time> высадка человека на Луну.</p>
</article>
</body>
“<progress></progress>”
<progress>
Текст
</progress>
HTML5. Используется для отображения прогресса завершенности задачи. Изменение значения происходит через JavaScript.
<body>
<p>Пожалуйста, подождите, фотографии загружаются.</p>
<progress>
Загружено на <span>25</span>%
</progress>
</body>
“<summary>Текст</summary>”
(сводка, краткое содержание)
<details>
<summary>Текст</summary>
</details>
HTML5. Указывает заголовок для тега <details>, по которому можно щелкать для разворачивания/сворачивания информации. Тег <summary> должен идти первым внутри <details>.</details></details>
<body>
<details>
<summary>Информация об авторе</summary>
<p>Бендер Родригез</p>
</details>
</body>
<details>Текст</details>
(подробности, детали)
HTML5. Тег <details> используется для хранения информации, которую можно скрыть или показать по требованию пользователя. По умолчанию содержимое тега не отображается, для изменения статуса применяется атрибут open.</details>
<body>
<details>Покажи, что у тебя есть!</details>
</body>
