тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Работа с основными HTML тегами

Давайте теперь изучим основные теги, которые используются на странице. В примерах далее я для простоты не буду приводить структуру всей страницы, считайте, что мы всегда работаем внутри тега body, если не указано иное.

Абзацы

Одним из основных элементов страницы являются абзацы. Их можно сравнить с абзацами в книге - каждый абзац начинается с новой строки и имеет так называемую красную строку (это когда первая строка текста абзаца немного отступает вправо). По умолчанию красной строки нет, но ее легко сделать (об этом чуть позже).

Абзац создается с помощью тега <p> таким образом:

<p> Это абзац. </p> <p> Это еще один абзац. </p> <p> И еще один абзац. </p>

Создайте на вашей странице 5 абзацев с каким-нибудь текстом. Посмотрите, как эти абзацы будут выглядеть в браузере.

Заголовки страницы

Кроме абзацев важное значение на странице имеют заголовки. Их также можно сравнить с заголовками из книги - каждая глава имеет свой заголовок (название этой главы) и разбита на параграфы, которые тоже имеют свои заголовки. Ну, а основной текст страницы располагается в абзацах.

Заголовки создаются с помощью тегов <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Они имеют разную степень важности. В заголовке h1 следует располагать название всей HTML страницы, в h2 - название блоков страницы, в h3 - название подблоков и так далее.

Все заголовки по умолчанию жирные и имеют разный размер (это можно поменять через CSS, но об этом позже). Для примера сделаем заголовки всех уровней:

<h1>Заголовок h1</h1> <h2>Заголовок h2</h2> <h3>Заголовок h3</h3> <h4>Заголовок h4</h4> <h5>Заголовок h5</h5> <h6>Заголовок h6</h6>

Скопируйте приведенный выше код себе и запустите его в браузере. Посмотрите, как отличаются размеры заголовков.

Сделайте заголовок h1. Ниже сделайте заголовок h2, а под ним - абзац с текстом. После абзацев сделайте еще один заголовок h2, а под ним - 2 абзаца с текстом.

Жирный

Вы уже знаете, что заголовки по умолчанию жирные. Однако, можно сделать жирным и обычный текст - достаточно взять его в тег <b>. Смотрите пример:

<p> Это обычный текст, а это <b>жирный</b> текст. </p>

Проверьте работу тега <b> на вашей странице.

Курсив

Кроме жирного можно сделать также и курсив с помощью тега <i>:

<p> Это обычный текст, а это <i>курсивный</i> текст. </p>

Проверьте работу тега <i> на вашей странице.

Практика

Повторите страницу по данному образцу:

Повторите страницу по данному образцу:

Замечания

Обратите внимание на то, что теги <b> и <i> следует использовать внутри какого-либо другого тега, например абзаца. В этом случае абзацы создают общую структуру страницы (абзацы и заголовки), а указанные теги делают жирным или курсивом отдельные кусочки текста.