Лабораторная работа № 1. Знакомство с HTML Ознакомиться с работой следующих тегов и параметров: html, head,
title, body (bgcolor, background, text, link), p (align), b, em, u, i, font, ol/ul, li, a.
Обратить внимание на то, что теги бывают парные и непарные, а также
на то, что у многих тегов имеются параметры.
Задание 1.1. Создать в Блокноте следующую web-страничку (Название
в title указать «Знакомство с HTML»):
Название страницы
Эпиграф
Кратко о себе несколько строчек. Описание должно содержать использование нескольких шрифтов, несколько слов выделить цветом. Страничка
должна содержать все перечисленные теги с разными параметрами.
Число
Что-то вроде подписи в виде графического файла
Работа с таблицами, рисунками, гиперссылками
Для работы с таблицами используются теги table (border), tr (width,
height), td/th (align, valign, width, colspan, rowspan)
Задание 1.2. Добавить к своей странице 2 таблицы с осмысленной информацией. Одна таблица — обычная, вторая должна содержать объединенные ячейки.
Для вставки рисунка используется тег img (alt, align, width, height,
vspace, hspace, border).
Задание 1.3. Добавить к своей странице один рисунок три раза с разными размерами. Все используемые рисунки должны храниться в отдельной
папке.
Гипертекстовые связи задаются при тега a (href, target, name).
Связи бывают трех видов: ссылки на ресурсы Internet, ссылка на сервис электронной почты, ссылки внутри документа.
Задание 1.4. Реализовать все три типа гиперссылок.
Задание 1.1. Создание web-странички:
1. Откройте текстовый редактор (например, Блокнот) и создайте новый файл.
2. На первой строке напишите следующий код: "". Этот тег указывает, что мы начинаем работать с HTML.
3. После этого, на следующей строке, напишите "". Тег "head" предназначен для включения мета-информации о странице и других важных элементов.
4. На новой строке напишите "
5. После этого, на следующей строке, напишите "". Тег "" закрывает раздел "head".
6. Далее, на новой строке, напишите "". Тег "body" определяет содержимое страницы, которое будет отображаться в окне браузера.
7. После этого, на следующей строке, напишите следующий код:
```
Название страницы
Кратко о себе несколько строчек. Описание должно содержать использование нескольких шрифтов, несколько слов выделить цветом.
```
В этом коде мы использовали теги "h1", "blockquote" и "p" для создания заголовков, цитаты и параграфа. Тег "p" имеет параметр "align", который задает выравнивание текста (в данном случае "justify").
8. На новой строке напишите следующий код:
```
Страничка
```
Здесь мы использовали теги "b" для выделения жирным шрифтом, "br" для переноса строки, а также создали нумерованный список с помощью тегов "ol" и "li".
9. На новой строке напишите следующий код:
```
```
Здесь мы использовали теги "table", "tr" и "td" для создания таблицы. Значение параметра "border" равное "1" указывает на то, что нужно отобразить рамку вокруг таблицы.
10. На новой строке напишите следующий код:
```
```
Здесь мы добавили вторую таблицу с объединенной ячейкой с помощью параметра "colspan". Значение "2" говорит о том, что нужно объединить две ячейки в одну.
11. На новой строке напишите следующий код:
```
```
Здесь мы использовали тег "img" для вставки рисунка. Значение атрибута "src" указывает путь к изображению, "alt" задает альтернативный текст (отображается, если изображение не загружено), "align" выравнивание, а "width" и "height" размеры изображения.
12. На новой строке напишите следующий код:
```
```
Здесь мы добавили второй рисунок с другими размерами и выравниванием.
13. На новой строке напишите следующий код:
```
```
Этот код добавляет третий рисунок с еще большими размерами.
14. На новой строке напишите следующий код:
```
Ссылка на ресурс
Ссылка на почту
Ссылка внутри документа
```
В этом коде мы использовали тег "a" для создания гиперссылок. Значение атрибута "href" задает адрес ресурса или почты. Для ссылок внутри документа, добавлено значение атрибута "href" в виде якоря.
15. На новой строке напишите следующий код:
```
Якорь
```
Этот код задает якорь, на который ссылается третья гиперссылка.
16. На новой строке напишите следующий код:
```