Делаем наши посты красивее!!! Таблица наиболее используемых при верстке HTML тегов.

На написание данного поста меня вдохновила статья @on0tole, где автор очень подробно излагает правила оформления постов на "Голосе" и дает полный курс по работе с Markdown. Поэтому, если Вы совсем новичек на проекте, советую сперва ознакомится с его работой.

Я же хотел Вам предоставить своего рода некую шпаргалку, которую очень удобно держать под рукой при написании и оформлении постов.

Выравнивание текста внутри контейнера `<div>`

Тег	Значение
`<div class="text-center">...</div>`	Выравнивание текста по центру. Используется в заголовках и различных подписях.
`<div class="text-left">...</div>`	Выравнивание текста по левому краю. Наиболее часто используемый способ.
`<div class="text-right">...</div>`	Выравнивание текста по правому краю. Применяется обычно редко, в основном для коротких заголовков объемом не более трех строк.
`<div class="text-justify">...</div>`	Выравнивание по ширине, что означает одновременное выравнивание по левому и правому краю.

Выравнивание и обтекание изображений текстом

Тег	Значение
`<div class="pull-left">...</div>`	Выравнивание изображения по левому краю.
`<div class="pull-right">...</div>`	Выравнивание изображения по правому краю.
`<center>...</center>`	Выравнивание изображения по центру.

Списки

Тег	Значение
`<ol>...</ol>`	Тег `<ol>` устанавливает нумерованный список. Каждый элемент списка должен начинаться с тега `<li>...</li>`.
`<ul>...</ul>`	Тег `<ul>` устанавливает маркированный список. Каждый элемент списка должен начинаться с тега `<li>...</li>`.

Редактирование и выделение текста

Тег	Значение
`<h1>...</h1>,...,<h6>...</h6>`	Теги `<h1>`,...,`<h6>`, являются заголовками разного уровня, которые показывают относительную важность секции.
`<p>`...`</p>`	Определяет текстовый абзац. Тег `<p>` является блочным элементом и всегда начинается с новой строки.
`<strong>Текст</strong>`	Тег `<strong>` предназначен для акцентирования текста. Браузеры отображают такой текст жирным начертанием.
`<em>Текст</em>`	Тег `<em>` предназначен для акцентирования текста. Браузеры отображают такой текст курсивным начертанием.
`<strike>Текст</strike>`	Тег `<strike>` отображает текст как перечеркнутый.
`<sub>Текст</sub>`	Отображает шрифт в виде нижнего индекса.
`<sup>Текст</sup>`	Отображает шрифт в виде верхнего индекса.
` `	Создает отступ первой строки абзаца (красной строки).

Добавление ссылок

Тег	Значение
`<a href="URL">...</a>`	Тег `<a>` предназначен для создания ссылок, где атрибут `href` задает адрес документа, на который следует перейти.

Еще пару очень нужных одиночных тегов

Тег	Значение
`Текст<br> текст`	Тег `<br>` устанавливает перевод строки в том месте, где этот тег находится.
`<hr>`	Рисует горизонтальную линию, которая всегда начинается с новой строки, а после нее все элементы отображаются на следующей строке.

Ну вот и все. Теперь берите и с дорогой душой пользуйтесь. И пусть ваши статьи будут по-настоящему красивы и привлекательны.

Думаю данная статья просто предназначена для репоста. И не забываем ГОЛОСовать и подписываться на мой блог @arey1983.