Теги HTML5
В этом разделе размещены описания и примеры использования основных тегов. В html5 - языке разметки гипертекста много нового и интересного. Появилось множество семантических элементов, с помощью которых поисковые роботы более правильно и полно индексируют содержание страниц. Также появился ряд новых тегов, позволяющих вставлять аудио и видео на сайт. Теперь не надо устанавливать граммосткие аудио и видео плееры на сайт, или вставлять коды со сторонних сервисов. Ниже более подробное описание и примеры применения основных элементов html5.
Теги - контейнеры для содержимого
<!DOCTYPE>
- указывает браузеру о версии языка разметки html документа<html>
- этот тег говорит что внутри него содержится html код<head>
- в нем содержатся мета данные для браузера и поисковых систем<body>
- в нем заключается все видимое содержимое от шапки до подвала<header>
- обозначает шапку сайта и иногда сложные заголовки статей<main>
- в нем заключается контент, содержимое между шапкой и подвалом<article>
- обозначает конкретное содержимое типа статьи или новости <aside>
- определает независимое содержимое боковой блок или колонку и др<section>
- предназначен для разделения контента на секции<div>
- используется для создания контейнеров, блоков для содержимого<footer>
- в этом теге заключается содержимое подвала сайтаТеги для разметки текста
<nav>
- определяет и используется для навигации по сайту
<menu>
- используется для семантической разметки списка меню
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
- используются для разметки заголовков
<p>
- используется для разметки текста на абзацы<br>
- применяется при разметке текста для переноса строки<i>
и <em>
- применяются для выделения текста курсивным шрифтом<b>
и <strong>
- эти теги выделяют текст жирным шрифтом<a>
- этот тег создает ссылки на внутренние и внешние страницы<abbr>
- тег для аббревиатур, расшифровки сокращенных и сленговых слов<address>
- предназначен для указания адреса автора сайта или контента<blockquote>
и <cite>
- предназначены для выделения цитат<dl>
<dt>
<dd>
- предназначены для разметки списка определений<details>
- создает скрытое содержание или детали к элементам <code>
- предназначен для выделения программного кода в тексте
<ul>
<li>
<ol>
- создают маркированный и нумерованный список
<small>
- уменьшает выделенный текст, делает его меньше чем основнойТеги для разметки графики, мультимедиа
<img>
- этот тег служит для вставки изображения <figure>
и <figcaption>
- используются для обозначения изображений <map>
и <area>
- используется для создания карты ссылок на изображении<audio>
- предназначен для воспроизведения аудио файлов на странице<video>
- позволяет воспроизводить видео файлы на странице<canvas>
- предназначен для создания графики при помощи JavaScript<hr>
- этот тег создает горизонтальную линиюТеги для создания таблиц
<table>
<td>
<tr>
<caption>
<col>
<colgroup>
<tbody>
<tfoot>
<th>
<thead>
- Теги для создания таблицы, назначение и краткое описание<table>
<tr>
<td>
- основные теги для создания таблицы<caption>
- предназначен для создания заголовка таблицы<col>
- задает параметры столбцов в таблицах<colgroup>
- предназначен для группирования столбцов (колонок) таблицыРазличные другие теги
<meta>
- в нем указывается информация для браузеров и поисковых систем<link>
- указывает браузеру пути до файлов в теге <head>
<base>
- указывает базовый адрес путей, с которого начинаются пути<button>
- предназначен для создания кнопок в формах<form>
- создает формы отправки данных на странице<fieldset>
- группирует содержимое форм отправки данных<iframe>
- создает фреймы для загрузки на страницу других веб страниц<input>
- создает разные элементы взаимодействия в формах<keygen>
- используется для шифрования при отправке данных