Шаг 5. Создание гиперссылок на объекты внутри документа

1. В файл index.html внесите такие изменения:

а) строку «Приветствую Вас на своей страничке!» пометьте при помощи атрибута name="top" тега <a>,

б) при помощи тега <br> в конце тела страницы, перед закрывающимся тегом </body>, вставьте 5 пустых строк,

в) перед закрывающимся тегом </body> вставьте ссылку на начало документа,

г) саму ссылку на начало страницы пометьте при помощи атрибута id="bottom".

После внесенных изменений файл должен выглядеть следующим образом:

<html>

<head>

<title>Главная страница</title>

</head>

<body>

<a name="top">Приветствую Вас на своей страничке!</a><br><br>

<a href="hello/hello.html" title="Перейти к приветствию"><img src="img1.gif"></a><br><br>

Вот мое <a href="hello/hello.html">приветствие</a>

<br>

<br>

<br>

<br>

<br>

<a id="bottom" href="#top">Перейти в начало документа</a>

</body>

</html>

2. Обновите файл index.html в окне браузера.

3. Уменьшите размер окна браузера по высоте на столько, чтобы файл index.html в него полностью не помещался.

4. При помощи вертикальной полосы прокрутки покажите окончание документа.

5. Проверьте работу ссылки на начало документа.

6. Отредактируйте файл hello.html, внеся в него, перед закрывающимся тегом </p>, гиперссылку на метку «bottom» в файле index.html. В результате файл hello.html будет иметь такое содержание:

<html>

<head>

<title>Мой первый документ HTML</title>

</head>

<body>

<p align="center">

<font color="#008080" size="7"><b>Всем</b></font><br>

<font size="6"><i>огромный привет!</i></font><br>

<a href="../index.html">Вернуться к главной странице</a><br>

<a href="../index.html#bottom">В конец главной страницы</a>

</p>

</body>

</html>

7. Проверьте работу всех ссылок.

Шаг 6. Создание внешних гиперссылок

1. В файле index.html создайте гиперссылку на сайт Академии. В результате он должен иметь такое содержание:

<html>

<head>

<title>Главная страница</title>

</head>

<body>

<a name="top">Приветствую Вас на своей страничке!</a><br><br>

<a href="hello/hello.html" title="Перейти к приветствию"><img src="img1.gif"></a>

<br><br>

Вот мое <a href="hello/hello.html">приветствие</a>

<br>

<br>

<a href="http://www.kname.edu.ua/">Здесь я учусь</a>

<br>

<br>

<br>

<a id="bottom" href="#top">Перейти в начало документа</a>

</body>

2. Проверьте работу ссылки.

Шаг 7. Создание гиперссылок на адреса электронной почты

1. В файле index.html создайте гиперссылку на произвольный адрес электронной почты. В результате он должен иметь такое содержание:

</head>

<body>

<a name="top">Приветствую Вас на своей страничке!</a><br><br>

<a href="hello/hello.html" title="Перейти к приветствию"><img src="img1.gif"></a>

<br><br>

Вот мое <a href="hello/hello.html">приветствие</a>

<br>

<br>

<a href="http://www.kname.edu.ua/">Здесь я учусь</a>

<br>

<br>

<a href="mailto:[email protected]">Мой е-mail</a>

<br>

<br>

<a id="bottom" href="#top">Перейти в начало документа</a>

</body>

</html>

2. Проверьте работу ссылки. Должна запуститься программа работы с электронной почтой.

Индивидуальные задания

1. В папке для хранения результатов выполнения индивидуальных заданий по работам MY_HTML отредактируйте HTML-документ, созданный в предыдущей работе, и который записан в файле index.html, так чтобы:

· в заголовке окна была фраза «Это я»;

· Вашу Фамилию Имя и Отчество отформатировать заголовком 3-го уровня;

· содержал графическое изображение, автопортрет созданный в программе Paint или Ваше фото;

· информация о увлечениях и дне рождения, должна быть вынесена в отдельные файлы, а связь с основным выполнялась при помощи гиперссылок;

· добавьте так же гиперссылки на сайт Академии и адрес Вашей электронной почты.

2. Создайте архив ssylka.zip и добавьте в него все файлы, созданные при выполнении индивидуального задания.

3. Отправьте результаты выполнения индивидуального задания преподавателю на проверку.

Наши рекомендации