HTML5 шпаргалка
Элемент <head> предназначен для хранения других элементов, цель которых — помочь браузеру в работе с данными. Также внутри контейнера <head> находятся метатеги, которые используются для хранения информации предназначенной для браузеров и поисковых систем.
*-закрывающий тег не требуется.
Элементы тега <body>
HTML тег <body> определяет содержимое (контент) HTML-документа, которое отображается в окне браузера (текст, ссылки, картинки (изображения), таблицы, списки и т.д.). Он должен быть единственным в документе и всегда должен располагаться внутри элемента <html> , сразу после элемента <head> .
Теги документа
| Тег | Описание | Атрибуты |
|---|---|---|
| <body> | Cодержит все содержимое HTML-документа, например текст, гиперссылки, изображения, таблицы, списки и т. д. | Универсальные атрибуты и события |
| <article> | Применяется для обозначения раздела страницы, содержащего завершенную, независимую композицию. Данный элемент может содержать в себе такую информацию как запись блога, товар в интернет-магазине, пост на форуме, газетная статья, любой другой независимый элемент содержимого или просто основной текст страницы. | Универсальные атрибуты и события |
| <aside> | Определяет блок сбоку от контента для размещения рубрик, ссылок на архив, меток и другой информации. Такой блок, как правило, называется «сайдбар» или «боковая панель». | Универсальные атрибуты и события |
| <address> | Предназначен для хранения информации об авторе и может включать в себя любые элементы HTML вроде ссылок, текста, выделений и т.д. Планируется, что поисковые системы будут анализировать содержимое этого тега для сбора информации об авторах сайтов. | Универсальные атрибуты и события |
| <section> | Содержит элементы, сгруппированные по темам.Применяться для блока новостей, контактной информации, глав текста, вкладок в диалоговом окне и др. Раздел обычно содержит заголовок. Допускается вкладывать один тег <section> внутрь другого. | Универсальные атрибуты и события |
| <header> | Задает «шапку» сайта или раздела, в которой обычно располагается заголовок. | Универсальные атрибуты и события |
| <nav> | Задаёт навигацию по сайту. Если на странице несколько блоков ссылок, то в <nav> обычно помещают приоритетные ссылки. Также допустимо использовать несколько <nav> в документе. Запрещается вкладывать <nav> внутрь <address>. | Универсальные атрибуты и события |
| <footer> | Задаёт «подвал» сайта или раздела веб-страницы, в нём может располагаться имя автора, дата документа, контактная и правовая информация. <footer> нельзя вкладывать внутрь другого <footer>, а также внутрь элементов <address> и <header>. Внутри <footer> не должно быть элемента <main>. | Универсальные атрибуты и события |
| <hgroup> | Используется для группирования заголовков веб-страницы или раздела. Внутри располагаются теги заголовков от <h1> до <h6>. | Универсальные атрибуты и события |
| <h1> .. <h6> | Заголовок для текущего раздела. | Универсальные атрибуты и события |
| <!— —> | Добавляет комментарий в код документа. | нет |
<address> — блочный элемент. Блочные элементы занимают всю ширину своего родителя (контейнера), формально создавая «блок».
Теги группировки, списки
* — закрывающий тег не требуется.
<address> — блочный элемент. Блочные элементы занимают всю ширину своего родителя (контейнера), формально создавая «блок».
<br> — строчный элемент. Используются для разметки частей содержимого элементов. Ширина строчного элемента равна объему содержимого.
Теги табличных данных
* — закрывающий тег не требуется.
Теги создания форм
* — закрывающий тег не требуется.
Интерактивные элементы
* — закрывающий тег не требуется.
Семантика и форматирование текста
* — закрывающий тег не требуется.
<br> — строчный элемент. Используются для разметки частей содержимого элементов. Ширина строчного элемента равна объему содержимого.
HTML <br> Tag
The HTML <br> tag defines a line break. Unlike the <p> tag defining a paragraph, an empty indent is not added before the line.
Syntax
The <br> tag is empty, which means that the closing tag isn’t required. But in XHTML, the (<br>) tag must be closed (<br/>).
Example of the HTML <br> tag:
Usage
The <br> tag is used to enter line breaks. It is useful for writing addresses, poems or song lyrics.
Тег <br> HTML перенос строки
Тег <br> указывает место переноса строки в тексте HTML страницы. Тег br ставится перед местом конца строки, текст после тега будет выведен с новой строки.
Стоит отметить, что тег <br> устанавливает границу между строками (означает разрыв строки), а не делит текст на абзацы. Чтобы определить абзацы в тексте HTML документа используйте тег <p>.
<br>: элемент «Разрыв строки»
Элемент <br> HTML создает разрыв строки в тексте (возврат каретки). Это полезно для написания стихотворения или обращения, где разделение строк имеет большое значение.
Try it
Как видно из приведенного выше примера, элемент <br> включен в каждую точку, где мы хотим, чтобы текст разрывался. Текст после <br> снова начинается в начале следующей строки текстового блока.
Примечание. Не используйте <br> для создания полей между абзацами; оберните их в элементы <p> и используйте свойство CSS margin для управления их размером.
Attributes
Атрибуты этого элемента включают глобальные атрибуты .
Deprecated attributes
Указывает,с чего начинать следующую строку после перерыва.
Стиль с CSS
Элемент <br> имеет единственную, четко определенную цель — создать разрыв строки в текстовом блоке. Таким образом, у него нет собственных размеров или визуального вывода, и вы мало что можете сделать для его стилизации.
Вы можете установить margin для самих элементов <br> , чтобы увеличить интервал между строками текста в блоке, но это плохая практика — вам следует использовать свойство line-height , предназначенное для этой цели.
Examples
Simple br
В следующем примере мы используем элементы <br> для создания разрывов строк между разными строками почтового адреса:
Результат выглядит так:
Accessibility concerns
Создание отдельных абзацев текста с помощью <br> — это не только плохая практика, но и проблема для людей, которые ориентируются с помощью технологии чтения с экрана. Программы чтения с экрана могут сообщать о наличии элемента, но не о любом содержимом, содержащемся в <br> s. Это может сбивать с толку человека, использующего программу чтения с экрана.
Используйте элементы <p> и используйте свойства CSS, такие как margin для управления их интервалом.