Вставка изображения
Для вставки изображения используется тег <img>. Обязательный атрибут src определяет имя вставляемого файла или его электронный адрес в Интернете.
Для установки фонового рисунка применяется атрибут background тега <body>.
Атрибут hspace задает размеры горизонтальных отступов по бокам изображения.
Пример вставки изображения (рис. 4):
Текст HTML-программы |
Комментарий |
<html> |
|
<head> |
|
<title> Моя домашняя страничка </title> |
|
</head> |
|
<body bgcolor=white text=black background=fon.gif> |
|
<center> |
|
<h1>Моя домашняя страничка</h1> |
|
</center> |
|
<img src="foto.gif" |
Вставка изображения |
align=left |
Обтекание изображения текстом справа |
hspace=10> |
Расстояние левого и правого поля вокруг изображения равное 10 пикселам |
<b>Здравствуйте.</b><br> |
|
Приветствую Вас на своей домашней страничке.<br><br> |
|
Немного о себе:<br> |
|
Студент Тюменского государственного университета |
|
<i> |
|
<pre> Обучаюсь в международном институте финансов, управления и бизнеса |
|
</pre> |
|
</i> |
|
</body> |
|
</html> |
|
Рис.4 Внешний вид Web-страницы в окне браузера
Задания для самостоятельного выполнения
В страничку о своей группе вставьте фотографию группы, в качестве фона используйте любое изображение.
Списки перечисления
Для создания маркированного списка используется тег <ul></ul>. Каждый элемент списка начинается тегом <li>.
Для создания нумерованных списков используется тег <ol></ol>, элементы списка начинаются тегом <li>.
Пример создания списков перечисления (рис.5):
Текст HTML-программы |
Комментарий |
<html> |
|
<head> |
|
<title> Мои увлечения </title> |
|
</head> |
|
<body bgcolor=white text=black background=fon.gif> |
|
<h2 align=center> |
Начальный тег заголовка с атрибутом выравнивания по центру |
Мои увлечения </h2> |
Текст и конечный тег заголовка |
<ul> |
Начальный тег маркированного списка |
<li> |
Тег элемента списка |
Пишу стихи |
Текст элемента списка |
<li>Читаю фантастику и детективы Агаты Кристи |
|
<li>Вяжу занавески для окон |
|
<li>Шью и перешиваю |
|
<li>Готовлю омлет |
|
<li>Пишу письма мелким почерком |
|
</ul> |
Конечный тег маркированного списка |
</body> |
|
</html> |
|
Рис.5 Web-страница со списком
Задания для самостоятельного выполнения
Создайте Web-страницу со списком студентов вашей группы.