Здравствуйте, в этой статье мы с вами будем работать с текстом в 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 программа 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. ( Материал с сайта murnik.ru)