Задание 1. Создание простейшей гиперссылки
• Создайте две Web-страницы в редакторе Блокнот. Одну назовите page1.html, вторую page2.html. Обе странички сохраните в одной папке под названием site. Обратите внимание, что названия папки и страничек должны быть на английском языке и начинаться со строчкой буквы
• В элементе < TITLE> укажите название странички «Задание 1. Создание простейшей гиперссылки».
• Фон страниц согласно варианту задания.
• На первой страничке создадим гиперссылку для перехода на вторую страницу. Для этого создайте элемент:
< А href= “page2.htm> Ha страницу 2 < /а>
• На второй страничке создадим гиперссылку для перехода на первую страницу. Для этого создайте элемент:
< А href= “page1.htm> Ha страницу 1 < /а>
• Откройте в браузере первую страничку и убедитесь, что обе гиперссылки работают правильно.
Задание 2. Создание гиперссылок
• Выполнить второе задание вы можете, если успешно справились с Заданием 1. Создайте третью страничку page3.htm.
• На страничке page3.htm создайте гиперссылки для перехода на странички page1.htm и page2.htm.
• На страничках page1.htm и page2.htm добавьте гиперссылку для переход на страничку page3.htm.
• На страничке page3.htm создайте в конце документа гиперссылку для перехода в начало этого же документа.
• Откройте в браузере первую страничку и убедитесь, что теперь можно перейти с любой странички на любую другую из трех созданных.
Задание 3. Цвет гиперссылок
• Выполнить задание вы можете, если успешно справились с Заданием 2.
• На страничках page1.htm, page2.htm и page3.htm в тэге < BODY> определите цвет гиперссылок согласно варианту задания
- все гиперссылки на странице - белые;
- активные гиперссылки - красные;
- посещенные гиперссылки - серые.
• Откройте в браузере первую страничку и, переходя по ссылкам со странички на страничку, убедитесь, что цвет гиперссылок задан верно.
№ варианта
| Задание
|
| Цвет фона первой страницы белый, цвет фона второй страницы жёлтый, цвет фона третьей страницы золотой. Все гиперссылки на странице - чёрные; активные гиперссылки - красные; посещенные гиперссылки - серые. Размер шрифта 2
|
| Цвет фона первой страницы чёрный, цвет фона второй страницы синий, цвет фона третьей страницы зелёный. Все гиперссылки на странице - белые; активные гиперссылки - жёлтые; посещенные гиперссылки - серебристые. Размер шрифта 3
|
| Цвет фона первой страницы индиго, цвет фона второй страницы фиолетовый, цвет фона третьей страницы каштановый. Все гиперссылки на странице – светло-зелёные; активные гиперссылки - золотые; посещенные гиперссылки - фуксиновые. Размер шрифта 4
|
| Цвет фона первой страницы золотой, цвет фона второй страницы белый, цвет фона третьей страницы жёлтый. Все гиперссылки на странице - зелёные; активные гиперссылки - пурпурные; посещенные гиперссылки - чёрные. Размер шрифта 5
|
| Цвет фона первой страницы синий, цвет фона второй страницы зелёный, цвет фона третьей страницы чёрный. Все гиперссылки на странице - серебристые; активные гиперссылки - золотые; посещенные гиперссылки - белые. Размер шрифта 6
|
| Цвет фона первой страницы каштановый, цвет фона второй страницы фиолетовый, цвет фона третьей страницы оливковый. Все гиперссылки на странице - индиго; активные гиперссылки - оранжевые; посещенные гиперссылки - ультрамариновые. Размер шрифта 2
|
| Цвет фона первой страницы оранжевый, цвет фона второй страницы белый, цвет фона третьей страницы сизый. Все гиперссылки на странице - синие; активные гиперссылки - золотые; посещенные гиперссылки - чёрные. Размер шрифта 3
|
| Цвет фона первой страницы белый, цвет фона второй страницы жёлтый, цвет фона третьей страницы золотой. Все гиперссылки на странице - чёрные; активные гиперссылки - красные; посещенные гиперссылки - серые. Размер шрифта 4
|
| Цвет фона первой страницы чёрный, цвет фона второй страницы синий, цвет фона третьей страницы зелёный. Все гиперссылки на странице - белые; активные гиперссылки - жёлтые; посещенные гиперссылки - серебристые. Размер шрифта 5
|
| Цвет фона первой страницы индиго, цвет фона второй страницы фиолетовый, цвет фона третьей страницы каштановый. Все гиперссылки на странице – светло-зелёные; активные гиперссылки - золотые; посещенные гиперссылки - фуксиновые. Размер шрифта 6
|
| Цвет фона первой страницы золотой, цвет фона второй страницы белый, цвет фона третьей страницы жёлтый. Все гиперссылки на странице - зелёные; активные гиперссылки - пурпурные; посещенные гиперссылки - чёрные. Размер шрифта 2
|
| Цвет фона первой страницы синий, цвет фона второй страницы зелёный, цвет фона третьей страницы чёрный. Все гиперссылки на странице - серебристые; активные гиперссылки - золотые; посещенные гиперссылки - белые. Размер шрифта 3
|
| Цвет фона первой страницы каштановый, цвет фона второй страницы фиолетовый, цвет фона третьей страницы оливковый. Все гиперссылки на странице - индиго; активные гиперссылки - оранжевые; посещенные гиперссылки - ультрамариновые. Размер шрифта 4
|
| Цвет фона первой страницы оранжевый, цвет фона второй страницы белый, цвет фона третьей страницы сизый. Все гиперссылки на странице - синие; активные гиперссылки - золотые; посещенные гиперссылки - чёрные. Размер шрифта 5
|
| Цвет фона первой страницы оливковый, цвет фона второй страницы золотой, цвет фона третьей страницы жёлтый. Все гиперссылки на странице - серые; активные гиперссылки - индиго; посещенные гиперссылки - чёрные. Размер шрифта 2
|
Контрольные вопросы
1. Понятие гипертекста
2. Понятие гиперссылки.
3. Структура гипрессылки
4. Относительный адрес.
5. Абсолтный адрес.
6. Внешние и внутренние гиперссылоки.
Лабораторная работа № 5.
Работа со списками
Цель работы: познакомиться с разными видами списков в HTML-документах, научиться создавать списки на Web-странице.
Очень важный элемент Web-страничек – списки.
Использование списков в качестве средства представления информации объясняется слудующим.
1. Информация в виде списка позволяет большие массивы даннызх на отделные четкие фрагменты, которые человеку гораздо удобнее воспринимать, чем весь поток целиком.
2. Списки позволяют создавать понятную и логичную внутреннюю структуру информационных данных ориентироваться в которой просто и удобно.
3. Использование списков удобно для отображения определенных пошаговых и прочих последовательных процессов.
Список отличается от обычного текста тем, что пользователю не надо думать о нумерации его пунктов: эту задачу программа берет на себя. Если список дополняется новыми пунктами или укорачивается, нумерация корректируется автоматически. В случае ненумерованных списков программа ставит перед каждым пунктом маркеры: кружки, прямоугольники, ромбы или другие изображения. В результате список принимает удобочитаемый вид.
Спецификация HTML предусматиривает три основных типа списков:
– маркерованные списки;
– нумерованные списки;
– списки определений.