Найти тему
LinuxUSER

HTML/CSS Часть 3: Теги <h1> - заголовок, <p> - параграф, <strong>

Я продолжаю цикл статей по созданию собственного веб-сайта в ОС Убунту

Итак, вернёмся в Sublime Text. В прошлый раз мы остановились на разметке страницы. Ссылка на начало:

HTML/CSS Часть 2

Весь контент сайта размещается между тегами <body> </body>

-2

Давайте теперь напишем в эти теги какой-нибудь контент. Начнём с тега <h1>. Большинство тегов начинаются с открывающего тега и закрывающего. Открывающий тег заголовка выглядит так: <h1>. Закрывающий тег заголовка выглядит так: </h1>. Между ними впишем название заголовка: <h1>LinuxUSER</h1>

-3

Это заголовок первого уровня. Всего их бывает шесть и выглядят они так: h1, h2, h3, h4, h5, h6. И создаются они аналогично заголовку первого уровня. Далее следующий тег называется параграф. Давайте его создадим написав под <h1>LinuxUSER</h1> открывающий тег<p> и закрывающий тег </p>. Этот тег и есть параграф: <p></p>

-4

Теперь впишем между открывающим и закрывающим тегом параграфа какой-нибудь текст. Например я напишу "Тег параграф. Показывает как работает тег параграф". Теперь сохраним результат комбинацией CTRL+S

-5

И откроем в ранее созданной папке LinuxUSER файл index.html при помощи браузера Firefox

-6

И как видно что под названием заголовка появился текст который мы вписали в теге параграф. Теперь рассмотрим тег <strong>. Этот тег позволяет выделять слова. Давайте напишем этот тег. Он так же начинается с открывающего тега и закрывающего: <strong></strong>

-7

Я поставлю в этот тег строчку "Показывает как работает тег параграф": <p>Тег параграф. <strong>Показывает как работает тег параграф</strong></p>

-8

Сохраняем комбинацией CTRL+S и открываем наш index.html браузером Firefox

-9

И у нас выделилась строка "Показывает как работает тег параграф"

В следующей статье продолжим изучать теги и затронем CSS:

HTML/CSS Часть 4

С подпиской рекламы не будет

Подключите Дзен Про за 159 ₽ в месяц