Лабораторная работа: Использование тегов форматирования текста Цель: Научиться использовать теги HTML для форматирования текста, чтобы улучшить его читаемость, выделение ключевых элементов и соответствие требованиям дизайна.   Критерии оценивания:

• Умеет применять теги форматирования текста.
• Создает документ с текстом, отформатированным с помощью основных и дополнительных HTML-тегов.
• Использует теги для улучшения читаемости и выделения важных элементов.

Ход работы:

1. Подготовительный этап:
   • Ознакомьтесь с основными тегами HTML для форматирования текста:
     • Заголовки: <h1> \u2013 <h6>
     • Абзацы: <p>
     • Полужирный текст: <b> или <strong>
     • Курсив: <i> или <em>
     • Подчеркнутый текст: <u>
     • Зачеркнутый текст: <s>
     • Цитаты: <blockquote> и <q>
     • Моноширинный текст: <code> и <pre>
2. Создание HTML-документа:
   • Откройте текстовый редактор (например, Visual Studio Code) и создайте новый файл с расширением .html.
   • Добавьте базовую структуру HTML:

<!DOCTYPE html> <html lang=»en»> <head> <meta charset=»UTF-8″> <meta name=»viewport» content=»width=device-width, initial-scale=1.0″> <title>Форматирование текста</title> </head> <body> <!— Контент страницы —> </body> </html>

1. Добавление текста и его форматирование:
   • Заголовки и абзацы:

<h1>Лабораторная работа 17</h1> <h2>Пример использования тегов</h2> <p>Этот текст демонстрирует возможности <b>HTML</b> для форматирования текста.</p>

1. • Полужирный и курсив:

<p><strong>Полужирный текст</strong> используется для выделения ключевых слов.</p> <p><em>Курсив</em> применяется для подчеркивания важности или акцентов.</p>

1. • Подчеркнутый и зачеркнутый текст:

<p><u>Подчеркнутый текст</u> привлекает внимание к важным элементам.</p> <p><s>Зачеркнутый текст</s> используется для указания на устаревшие или удаленные элементы.</p>

1. • Цитаты:

<blockquote>Это пример длинной цитаты, которая отображается отдельно от основного текста.</blockquote> <p>Краткие цитаты, такие как <q>Великое дело требует времени</q>, могут быть встроены в текст.</p>

1. • Моноширинный текст:

<p>Пример моноширинного текста:</p> <pre> Line 1: Код Line 2: Пример </pre> <p>Короткие участки кода можно выделить с помощью <code>тега &lt;code&gt;</code>.</p>

1. Стилизация текста с использованием тегов:
   • Создайте текстовый блок, комбинируя разные теги форматирования:

<p> Это <b>важное</b> сообщение содержит <i>курсивный</i> и <u>подчеркнутый</u> текст. Также вы можете использовать <s>зачеркнутый</s> текст для выделения удаленных элементов. </p>

1. Проверка работы:
   • Сохраните файл и откройте его в браузере.
   • Проверьте, что все элементы форматирования отображаются корректно.
2. Оформление отчета:
   • Включите:
     • Код HTML-документа.
     • Скриншот результата в браузере.
     • Краткое описание примененных тегов.

Пример задания: Создайте веб-страницу с текстом, форматированным следующим образом:

1. Заголовок страницы.
2. Абзацы с полужирным и курсивным текстом.
3. Цитата, оформленная с использованием <blockquote>.
4. Пример кода, выделенного с помощью <code>.

Советы:

• Используйте комбинацию тегов для создания сложного форматирования.
• Убедитесь, что текст читаем и его оформление соответствует целям документа.
• Проверьте наглядность и визуальную иерархию текста.

Ожидаемый результат:

• Готовый HTML-документ с текстом, отформатированным различными тегами.
• Четкое и аккуратное отображение текста в браузере.
• Понимание возможностей тегов HTML для форматирования текста.