2015-05-10
343
1. Сохраните в отдельной папке HTML изображения, указанные преподавателем.
2. В папке HTML создайте файл Eifel.html и запишите в нем следующий код:
<html>
<head>
<title>Эйфелевая башня</title>
</head>
<body>
<img src="Eifel.jpg" height="300" align="left">
</body>
</html>
3. Создайте в своей папке файл Link.html и запишите в нем следующий код:
<html>
<head><title>Создание гиперссылок</title></head>
<body>
Во Франции есть очень много великих памятников. Сначала мы посетим Эйфелевую башню.
</body>
</html>
4. Определите в документе Link.html текстовую гиперссылку на документ Eifel.html, который размещен с ним в одном каталоге (рис.1). Для этого модифицируйте код и просмотрите его в браузере:
...
Во Франции есть очень много великих памятников. Сначала мы посетим <a href="Eifel.html">Эйфелевую башню</a>.
</body>
Гиперссылка будет загружать файл Eifel.html в то же самое окно браузера.
Рис.1.
5. Определите в документе Link1.html графическую гиперссылку на тот же файл Eifel.html. Добавьте для этого соответствующий код и просмотрите результат в браузере:
|
|
|
...
<a href="Eifel.html"><img src="Eifel.jpg"></a>
</body>
6. Создайте в своей папке катало А. В нем создайте файл под названием Zamok.html и скопируйте необходимое изображение.
7. В файле Zamok.html запишите следующий html-код:
<html>
<head>
<title>Замок</title>
</head>
<body>
<img src="Zamok.jpg" height="300" align="left">
</body>
</html>
8. Запишите в каталоге А в файле Link2.html html-код, в котором установите текстовую и графическую гиперссылки:
...
<a href="A/Zamok.html"><center>Замок</center></a>
<br><center><a href="A/Zamok.html"><img src="Flower.jpg" width="150" height="150"></a></center>
</body>
9. На одном уровне с папкой HTML создайте папку В. Скопируйте файл Zamok.html в эту папку. В документ Link3.html создайте текстовую гиперссылку на документ Zamok.html, находящуюся в папке В:
...
<br><a href="../B/ Zamok.html ">На документ Zamok.html, который находится в папке В</a>
</body>
10. Используя абсолютную адресацию, в документе Link4.html создайте текстовую гиперссылку на HTML-документ Zamok.html, который находится в папке B (например, на диске Е:), то есть по адресу E:\B\Zamok.html:
...
<br><a href="="E://B/ Zamok.html ">На документ Zamok.html, который находится в папке В</a>
</body>
11. Определите в документе Link5.html текстовую и графическую гиперссылку на сайт, находящийся по адресу http / / narod.yandex.ru:
...
<br><a href="http//narod.yandex.ru">Замок</a>
<br><a href="http//narod.yandex.ru"><img src="Flower.jpg"></a>
</body>
12. Создайте в документе Link6.html текстовую гиперссылку на адрес электронной почты:
...
<br><a href="mailto:pochta@ukr.net ">Пошта</a>
</body>
13. В папке HTML создайте текстовый документ с названием Recepti.html и запишите в нем такой HTML-код:
|
|
|
<html>
<head><title>Создание внутренней гиперссылки</title></head>
<body>
<h1>Рецепты</h1>
<h3>1. Корзинки с кофейным кремом </h3>
<h3>2. Пироженные "Наполеон"</h3>
<h3>3. Яблоки в заварном тесте </h3>
<h2 align="center">1. Корзинки с кофейным кремом </h2>
<h3>Тесто:</h3>
<p align="justify">300 г муки, 100 г сахара, 150 г сливочного маслаили маргарина.</p>
<h3>Крем:</h3>
<p align="justify">1 ст. ложка муки, 2 желтка, 100 г сахара, 100 г сливочного масла, 3 ст. ложки настойки крепкого кофе, 100 г измельченных орехов.</p>
...
<h2 align="center">3. Яблоки в заварном тесте </h2>
<h3>Тесто:</h3>
<p align="justify">80 г раcтопленого сливочного масла, 1 стакан воды, 150 г муки, 3 яйца.</p>
<h3>Начинка:</h3>
<p align="justify">1 кг яблок, 1 ст. ложка варенья.</p>
<h3>Приготовление </h3>
<p align="justify">К гарячему растопленому маслу долить гарячей воды и закипятить...</p>
</body>
</html>
14. Создайте в документе Recepti.html ссылку на текст третьего пункта документа - "Яблоки в заварном тесте". Для этого:
- Разместите непосредственно перед третьим пунктом "якорь" с именем apple:
...
<a name= apple> </a><h2 align="center">3. Яблоки в заварном тесте </h2>
...
- Модифицируйте HTML-код файла Recepti.html для определения самой внутренней ссылки. При этом в параметре href указываем имя "якоря" с приставкой #:
...
<h3><a href="#apple">3. Яблоки в заварном тесте </a> </h3>
...
15. Написать отчет и ответить на контрольные вопросы.
Контрольные вопросы к ЛПР № 8
1. Как открыть гиперссылку в новом окне браузера?
2. Как определить якорь в HTML-документе?
3. Как используется в гиперссылках абсолютная адресация?
4. Как используется в гиперссылках относительная адресация?
5. Как открыть гиперссылку в том же окне браузера?
6. Правила записи текстовых гиперссылок.
7. Как определить гиперссылки на рисунок?
8. Как определить цвета ссылок (активных, просмотренных)?
9. Как определить гиперссылки внутри HTML-документа?
10. Как записать гиперссылки на адрес электронной почты?
Контрольные вопросы к ЛПР № 8
1. Как открыть гиперссылку в новом окне браузера?
2. Как определить якорь в HTML-документе?
3. Как используется в гиперссылках абсолютная адресация?
4. Как используется в гиперссылках относительная адресация?
5. Как открыть гиперссылку в том же окне браузера?
6. Правила записи текстовых гиперссылок.
7. 8. Как определить гиперссылки на рисунок?
8. Как определить цвета ссылок (активных, просмотренных)?
9. Как определить гиперссылки внутри HTML-документа?
10. Как записать гиперссылки на адрес электронной почты?
Контрольные вопросы к ЛПР № 8
1. Как открыть гиперссылку в новом окне браузера?
2. Как определить якорь в HTML-документе?
3. Как используется в гиперссылках абсолютная адресация?
4. Как используется в гиперссылках относительная адресация?
5. Как открыть гиперссылку в том же окне браузера?
6. Правила записи текстовых гиперссылок.
7. 8. Как определить гиперссылки на рисунок?
8. Как определить цвета ссылок (активных, просмотренных)?
9. Как определить гиперссылки внутри HTML-документа?
10. Как записать гиперссылки на адрес электронной почты?
Контрольные вопросы к ЛПР № 8
1. Как открыть гиперссылку в новом окне браузера?
2. Как определить якорь в HTML-документе?
3. Как используется в гиперссылках абсолютная адресация?
4. Как используется в гиперссылках относительная адресация?
5. Как открыть гиперссылку в том же окне браузера?
6. Правила записи текстовых гиперссылок.
7. 8. Как определить гиперссылки на рисунок?
8. Как определить цвета ссылок (активных, просмотренных)?
9. Как определить гиперссылки внутри HTML-документа?
|
|
|
10. Как записать гиперссылки на адрес электронной почты?
Контрольные вопросы к ЛПР № 8
1. Как открыть гиперссылку в новом окне браузера?
2. Как определить якорь в HTML-документе?
3. Как используется в гиперссылках абсолютная адресация?
4. Как используется в гиперссылках относительная адресация?
5. Как открыть гиперссылку в том же окне браузера?
6. Правила записи текстовых гиперссылок.
7. 8. Как определить гиперссылки на рисунок?
8. Как определить цвета ссылок (активных, просмотренных)?
9. Как определить гиперссылки внутри HTML-документа?
10. Как записать гиперссылки на адрес электронной почты?
