Лабораторная работа № 5. Изображения. Списки. Ссылки

Цель работы: научиться добавлять изображения в документ, управлять атрибутами тега; создавать нумерованные, маркированные и многоуровневые списки; создавать внутренние и внешние ссылки.

Содержание лабораторной работы

1. Создать в своей папке файл lab5.html.

2. Вставить изображение в HTML-документ с учетом: ширины, высоты, выравнивания, всплывающих подсказок и т.д. (рисунок 2.1)

Рисунок 2.1 – Примеры выравнивания изображения относительно текста

3. Создать список определений согласно примеру. Использовать для этого теги <dl>, <dt> и <dl>.

4. Создать маркированный список используйте тег <ul>:

В языке HTML предусмотрены следующие основные типы списков:

маркированный нумерованный список определений

Изменить внешний вид маркера на квадрат:

В языке HTML предусмотрены следующие основные типы списков:

маркированный нумерованный список определений

5. Создать нумерованный список.

В языке HTML предусмотрены следующие основные типы списков:

маркированный нумерованный список определений

Осуществить нумерацию римскими цифрами и изменить начало нумерации с числа XV.

В языке HTML предусмотрены следующие основные типы списков:

маркированный нумерованный список определений

6. Создать список с многоуровневой нумерацией.

Глава 3. Использование графики на Web-страницах

Фоновое изображение Встраиваемое изображение Выравнивание изображений Размеры выводимого изображения Рамка вокруг изображения Практическая работа 3.1 Практическая работа 3.2 Практическая работа 3.3

7. Обозначить начало каждого из пяти разделов лабораторной работы как именованный якорь: <a name="spisok1">, <a name="spisok2"> и т.д.

8. В начале страницы добавить список ссылок на все разделы лабораторной работы. Помните, что при ссылке на именованный якорь следует использовать знак # перед именем якоря.

9. Добавить внизу документа ссылку на официальный сайт ОНАПТ, которая будет открываться в новом окне.

10. Второе изображение в документе сделать ссылкой на поисковую систему Yandex, которая будет открываться в новом окне.

11. В файле index.html, разработать список, содержащий ссылки на задания лабораторных работ 4 и 5.

12. Создайте новый файл my.html и записать в нем: нумерованный список из известных языков программирования, маркированный список из известных цветовых палитр.

13. Добавить ссылку на файл my.html в файл index.html.

14. Показать и защитить выполненную работу преподавателю.

Контрольные вопросы

1. Какой тег служит для вставки изображения в html-документ?

2. Где в теге <img> указывается путь к графическому файлу?

3. Как задать выравнивание картинки относительно текста?

4. Какие списки существуют в HTML?

5. Какой тег участвует в создании как маркированного так и нумерованного списков?

6. Как изменить порядок нумерации в нумерованном списке?

7. Как изменить вид маркера в маркированном списке?

8. Что такое списки определений?

9. Как задать якорь для ссылок в приделах одного документа?

10. За что отвечает атрибут target у тега <a>?