Шпаргалка по языку html. Основные тэги

Язык htmlРазработчик сайтов с помощью шаблонов WordPress лишен необходимости подробно изучать языки программирования. Однако, знать базовые основы языка html ему также необходимо. Дело в том, что этот язык используют все сайты в мире. И если вы хотите успешно создавать веб-ресурсы и даже просто редактировать статьи и записи, вам необходимо знать хотя бы самые основные тэги html.

Оформление текста на веб-странице, выделение жирным слов и букв, написание текста курсивом, подчеркивание, изменение цвета и тд. происходит по средством специальных html-тегов. Например, чтобы выделить слово жирным, его нужно заключить в тег <strong> пример: <strong>слово</strong>.

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

Памятка основных тэгов html

Вот памятка по основным тегам которые используются при оформлении текста на веб-странице.

<p>текст</p> — Параграф, который позволяет разбивать текст на блоки.

<br> — Тэг переноса строки.

<a>ссылка</a> — Создание ссылок на другие сайты, страницы и файлы.

<strong>текст</strong> — Жирный текст.

<em>текст</em> — Курсив.

&nbsp; — пробел в Html. Как правило, используется для того, чтобы сделать абзац на веб-странице.

<del>текст</del> Тэги для зачёркивания текста.

<blockquote>Цитата</blockquote> Тэги, используемые для создания цитаты.

<hr /> — Тэг горизонтальной черты на ве-страницы. Используется для разделения тестовых блоков. Растягивается на всю ширину страницы.

<p style="text-align: left;">Текст</p> — Выравнивание текста или картинки по левой стороне.

<p style="text-align: right;">Текст</p> — Выравнивание текста или картинки по правой стороне.

<p style="text-align: center;">Текст</p> — Выравнивание текста или картинки по середине.

<p style="text-align: justify;">Текст</p> — Выравнивание текста по ширине веб-страницы.

<span style="text-decoration: underline;">Текст</span> — Тэг html для подчеркивания текста.

<span style="color: #ff0000;">Текст</span> — Тэг html для выделения текста цветом различным цветом. В данном случае цвет «красный» представляет собой код #ff0000;. Вы должны знать, что все цвета на веб-страницах предстают в виде такого кода. Посмотреть соответствие цвета и его кода можно, например, в Таблице безопасных цветов Студии Артемия Лебедева.

<p style="padding-left: 30px;">Текст</p> — Тэг для отступа текста от левого края. Обратите внимание, что в данном случае отступ составляет 30px. Вы можете самостоятельно задать величину отступа, изменяя это параметр.

Создание маркированного списка представляет из себя следующий набор тэгов.
<ol>
<li>1. Первый</li>
<li>2. Второй</li>
</ol>

Создание заголовков:
<h1>Заголовок 1</h1> — Заголовок 1 самый крупный.
<h2>Заголовок 2</h2> — Заголовок 2 менее крупный.
<h3>Заголовок 3</h3> — Заголовок 3 средний.
<h4>Заголовок 4</h4> — Заголовок 4 малый.

<big>текст</big> — Тэг увеличивает размер шрифта

<div></div> — Логический тэг раздела, в основном используется для выравнивания блоков текста, а также придания этому блока определенного вида с помощью таблиц CSS.

<span></span> — Логический тэг, используется для выделения отдельных слов в предложении с помощью CSS и других подобных вещей.

Стоит отметить, что редактирование статей в WordPress имеет две формы Визуальная и Текст. В форме Текст, все свойства форматирования предстают в виде тегов. А в разделе Визуально представлен результат, который будет виден в итоге на веб-странице без тегов. На начальном этапе вы можете использовать визуальную форму, чтобы понять принцип работы языка html. Однако, в дальнейшем опытные программисты практически не пользуются этим разделом.



Комментарии на сайте