 |
Главная Случайная страница Контакты | Мы поможем в написании вашей работы! | |
Наш сайт
|
|
Пора и в наш сайт вставить гиперссылки. Рассмотрим, как создать переход по ссылке с конца второй страницы lab2.html на первую страницу нашего сайта, т.е. к файлу lab1.html. Для того, чтобы сообщить посетителю сайта о возможности вернуться к первой странице, необходимо предусмотреть между открывающим <а> и закрывающим </а> тэгами соответствующий текст, например:
<а href="lab1.html">Ha первую страницу</а>
Обратите внимание, что адрес ссылки должен быть заключен в кавычки, так как некоторые браузеры могут не понять его без кавычек.
Для того, чтобы ссылка На первую страницу была центрирована, следует ограничить элемент <а>...</а> тэгами <center>…</center>.
Вставим в файле lab2.html пустую строку перед закрывающим тэгом </body> и введем в ней следующий код:
<center><a href="lab1.html">Ha первую страницу</а></сеnter>/
В результате получим следующий HTML-код:
<html>
<head>
<title>Чем мы занимаемся?</title>
</head>
<body bgcolor=aqua text=navy>
<h2 align=center>Чем мы занимаемся?</h2>
<ul>
<li>Разработкой компьютерных распределённых систем управления
<li>Разработкой простых и дешёвых SCADA–систем
<li>Внедрением покупных SCADA–систем
<li>Разработкой управляющих программ для промышленных
контроллеров
</ul>
<form action="mailto: [email protected]" method=post>
<center><textarea rows=5 cols=40 name=Comments></textarea><center>
<p><center><input type=submit value="Отправить"></center></р>
</form>
<center><a href="lab1.html">Ha первую страницу</а></сеnter>/
</body>
</html>
Теперь создадим гиперссылку для перехода с первой страницы нашего сайта lab1.html на вторую lab2.html. Для ссылки логичней всего будет использовать текстовый фрагмент о наших достижениях, так как список на второй странице раскрывает содержание именно этого фрагмента текста. Поэтому нам нужно в файле lab1.html поместить открывающий тэг <а> с атрибутом href="lab2.html" перед фрагментом текста о нашей деятельности, а закрывающий тэг </а> - после него.
Для этого откроем в программе Блокнот файл lab1.html и отредактируем этот файл, вставив тэг <а href="lab2.html"> перед текстом о нашей деятельности, а закрывающий тэг </а> – после него. HTML-код в файле lab1.html должен принять следующий вид:
<html>
<head>
<title>Лаборатория АСУТП</title>
</head>
<body bgcolor=blue text=yellow >
<h1 align=center>
Добро пожаловать на страницу нашей лаборатории!
</h1>
<center><img src= labor.jpg border=1 Widht=300 height=400></center>
<p style="font-weight: bold; font-style: italic; font-size: 150%; text-align:
сеnter">
Здесь Вы узнаете <а href="lab2.html">о наших достижениях и планах на будущее</а>
</р>
</body>
</html>
Может оказаться, что ссылка о наших достижениях и планах видна очень плохо или вообще не видна. Это связано с тем, что цвет, которым браузер отображает непросмотренные ссылки, может совпадать с цветом фона документа. В таком случае цвет ссылок следует изменить, воспользовавшись атрибутами link и vlink тэга <body>. Атрибут link определяет цвет непросмотренной ссылки, а vlink – просмотренной. Еще один атрибут alink определяет цвет ссылки в момент, когда на ней установлен указатель мыши и нажата левая кнопка.
Если вы устанавливаете какой-либо из атрибутов bgcolor, text, link, vlink, alink, то устанавливайте их все. Иначе, например, установленный вами фоновый цвет может совпасть с цветом текста, установленным пользователем в браузере.
Установим для непросмотренной ссылки белый цвет white, для просмотренной – светло – зеленый lime, а для ссылки в момент щелчка мышью – красный red:
<body bgcolor=blue text=yellow link=white, vlink=lime, alink=red>
Вставить переход в документе можно не только с помощью текстовой ссылки, но также и с рисунка. Рассмотрим, как вставить переход с рисунка на вторую страницу.
Для создания такой ссылки достаточно в файле lab1.html вставить открывающий тэг <а href="lab2.html"> перед тэгом <img src= labor.jpg border=1 Widht=300 height=400> и закрывающий тэг </а> после него. С учетом всего сказанного выше HTML-код в файле lab1.html примет следующий вид:
<html>
<head>
<title>Лаборатория АСУТП</title>
</head>
<body bgcolor=blue text=yellow link=white, vlink=lime, alink=red>
<h1 align=center>
Добро пожаловать на страницу нашей лаборатории!
</h1>
<center><а href="lab2.html"><img src= labor.jpg border=1 Widht=300 height=400></а> </center>
<p style="font-weight: bold; font-style: italic; font-size: 150%; text-align:
сеnter">
Здесь Вы узнаете <а href="lab2.html">о наших достижениях и планах на будущее</а>
</р>
</body>
</html>
Создавая ссылки на страницы нашего сайта, мы использовали в качестве адреса имя файла. При таком указании адреса браузер всегда ищет файл в текущем каталоге. Если бы нужный файл lab2.html находился в подкаталоге Doc текущего каталога, то в адресе необходимо было бы указать путь к нему от текущего каталога: <а href="Doc\lab2.html">. Такая ссылка, в которой адрес указывается относительно текущего каталога на том же компьютере, называется относительной.
Вы можете также использовать в ссылках полный URL-адрес, указывающий на файл, находящийся в определенном каталоге определенного компьютера в сети. Такая ссылка называется абсолютной. В то время, как относительные ссылки указывают на файлы, расположенные на том же самом компьютере, абсолютные ссылки служат для представления адресов документов на других компьютерах в Интернете.
Дата публикования: 2015-01-23; Прочитано: 202 | Нарушение авторского права страницы | Мы поможем в написании вашей работы!
