Лабораторные работы. Краева / Web-технологии. Отчет №1
.pdf
Упражнение №5 Добавлено открытие изображений при нажатии на них:
Рисунок 20. Открытие
Упражнение №6 Добавлен раздел со ссылками на другие страницы.
Рисунок 21. Добавление ссылок
Результат работы
Рисунок 22. Отображение гиперссылок
Упражнение №7 Нерабочие ссылки были заменены на готовые рабочие страницы.
Рисунок 23. Нерабочие ссылки были заменены на готовые рабочие страницы
Упражнение №8 Добавление аудиофайла на сайт — Гимна Санкт-Петербурга.
Рисунок 24. Добавление аудио
В результате на сайте появился миниаудиоплеер с записью.
Рисунок 25. Аудиоплеер
Упражнение №9
Была добавлена форма с помощью тега <form>:
Рисунок 26. Форма
Результат работы:
Рисунок 27. Форма
Заключение
По итогу выполнения данной работы, рассмотрена структура HTML-документа, а также основные теги.
Контрольные вопросы
1. Язык тегов HTML
HTML (HyperText Markup Language) — это язык разметки гипертекста,
предназначенный для создания и структурирования веб-страниц.
2. Структура HTML-документов
<!DOCTYPE html> — объявление типа документа.
<html> — корневой тег всего документа.
<head> — заголовочная часть, содержащая метаданные, ссылки на стили и скрипты.
<body> — тело документа, где размещается контент страницы.
3. Характеристика форматирования абзаца и шрифта
Абзацы создаются с помощью тега <p>. Для форматирования текста существуют теги, которые влияют на внешний вид, например: <b> для жирного шрифта, <i> для курсива, <u> для подчёркивания, <font> для изменения размера, шрифта, цвет текста. Переносы строк можно делать с помощью <br>.
4. Цветовая гамма HTML-документа
Набор цветовых атрибутов, задаваемых внутри тега <body>, которые определяют цвета фона, текста на странице.
5. Относительный и абсолютный адреса
Абсолютный адрес — полный URL (например, https://example.com/page.html),
указывающий точное расположение ресурса в интернете.
Относительный адрес указывает путь относительно текущего документа (например, images/pic.jpg), используется для ссылок и ресурсов внутри сайта .
6. Основные типы списков в HTML-документах
Списки могут быть трех типов:
Маркированный список <ul> — элементы с буллитами.
Нумерованный список <ol> — элементы с порядковыми номерами.
7. Основные методы создания таблиц
Таблицы создаются с помощью тега <table>. Внутри таблицы размещаются: <tr> — строка таблицы.
<th> — заголовочная ячейка. <td> — ячейка данных.
8. Основные теги для создания HTML-форм Основные теги для создания форм:
<form> — контейнер формы с атрибутами action (адрес обработки), method (метод отправки).
<input> — для различных полей ввода (type может быть text, password, checkbox, radio, submit и др).
<label> — метка для элемента формы, связывает текст с полем.