Тема: Создание рисунков
Цель: научиться вставлять рисунки в web-документ
Контрольные вопросы:
1. Назовите наиболее популярные графические форматы для web-страниц.
2. Назовите тег для вставки рисунков в HTML и перечислите его атрибуты.
3. Как задать расположения рисунка на странице?
4. Как указать обтекание текстом рисунка?
Теоретический материал
В этой лабораторной работе вы познакомитесь с дескрипторами изображения, такими как:
- <IMG> – вставляет изображение в документ.
Данный дескриптор имеет следующие атрибуты:
- src="x" – источник изображения (его абсолютный или относительный URL);
- width="x" – позволяет браузеру заранее установить ширину изображения;
- height="x" – позволяет браузеру заранее установить высоту изображения;
- border="x" – определение ширины рамки вокруг изображения;
- align="x" – выравнивание изображения на странице по горизонтали и вертикали;
- alt="описание" – позволяет браузерам выводить на экран вместо изображения его описание; это описание отображается на экране любого браузера до тех пор, пока не произойдет загрузка самого изображения. Кроме того, атрибут alt позволяет выводить на экран элемент подсказки с описанием, когда указатель мыши располагается над изображением;
|
|
- hspace="x" – свободное пространство по горизонтали; используется для добавления свободного места справа и слева от изображения;
- vspace= "x" – свободное пространство по вертикали.
Порядок выполнения работы:
1. Создайте простую web-страницу с изображением, которое будет иметь различные виды выравнивания относительно текста.
<html>
<head>
<title>Изображения</title>
</head>
<body>
<h3> Страница, содержащая рисунки </h3>
<p>
<img src = "адрес вашего рисунка" align="top"> Изображение, выровненное по верхнему краю.
<p>
<img src = "адрес вашего рисунка" align = "middle"> Изображение, выровненное по центру изображения.
<p>
<img src = "адрес вашего рисунка" align = "bottom"> Изображение, выровненное по нижнему краю.
</body>
</html>
2. Сохраните файл под названием Lesson_3.html.
3. Просмотрите созданный документ в браузере.
Содержание отчета
В качестве отчета необходимо предоставить полученный вами файл Lesson_3.html.