Текст html

Здравствуйте, в этой статье мы с вами будем работать с текстом в html. Познакомимся с тем как сделать текст курсивом, жирным и подчеркнутым. И другие моменты которые нужно знать при работе с текстом в html.

Теги для текста html.

<p> </p> — очень популярный тег, его вы будете использовать сотни раз на странице, обозначает абзац. Все тексты разделены на абзацы, так вот каждый абзац заключен в тег  <p>Абзац</p>.

<b> </b> — если вы хотите сделать часть текста или слово в тексте жирным нам понадобиться тег <b>Полужирный шрифт</b>.

<i> </i> — тег используется что бы сделать текст <i>курсивом</i>.

Давайте теперь сделаем текст жирным и курсивом. 

<p><b><i>Жирный и курсивный текст</i></b></p>

Здесь есть очень важное правило, которое называется принцип вложенности тегов. Оно гласит внешний тег нельзя закрывать до тех пор пока у нас не закрыты все внутренние теги.

Это означает что если у нас открыт тег <p> мы не можем его закрыть пока не закроем все внутренние теги <b> или <i> и т.д.

Всегда соблюдайте принцип вложенности тегов это очень важно.

Что бы все выглядело более красиво рекомендуется писать код каждый на новой строчке вот так:

текст в html
текст в html программа Notepad++

Для создания и редактирования html-страниц подойдёт даже Блокнот. Но я рекомендую использовать Notepad++.

Рассмотрим еще несколько тегов для текста.

<ins>Подчеркнутый текст</ins>

<del>Перечеркнутый текст</del>

<sup>Надстрочный текст</sup>

<sub>Подстрочный текст</sub>

<h1>Заголовок первого уровня</h1>

<h2>Заголовок второго уровня</h2>

<h6>Заголовок шестого уровня</h6>

<q>кавычки</q>

<br>Переход на новую строку.

<hr>Горизонтальная разделительная линия.

Вот как это выглядит в редакторе Notepad++.

теги для текста в html
теги для текста в html

Как выглядит в браузере.

пример отображения тегов html в браузере
пример отображения тегов html в браузере

На этом у меня все. Переходите на следующий урок списки в html.