We
Study
Together
cat


Ссылки

Тэг <a>…</a> делает ссылкой заключенные в него текст или рисунок. Принцип прописывания пути такой же, как для изображения. В качестве отправной точки используется адрес текущего документа, это позволяет использовать относительные ссылки. Первые две ссылки указаны именно так, в них мы ссылаемся на Web-документы, находящиеся в том же каталоге, что и родительская страница:

<a href=имя.html>показать</a> - документ, на которую указывает ссылка лежит в той же папке, что и основная страница;
<a href=image/имя.html>показать</a> - страница лежит в поддиректории image;

При ссылке на другой сайт, используем абсолютный путь, включающий имя сайта и название страницы:

<a href=http://www.page.com/имя.html>показать</a> - ссылаемся на сайт http://www.page.com.

Атрибут href - определяет находящийся между начальным и конечным тегами текст или изображение как гипертекстовую ссылку на документ или область документа, указанный в значении данного атрибута. Возможные значения:
http://... - создает ссылку на www-документ;
ftp://... - создает ссылку на ftp-сайт или расположенный здесь файл;
mailto:... - запускает почтовую программу;
news:... - создает ссылку на конференцию сервера новостей;
telnet://... - создает ссылку на telnet-сессию с удаленной машиной.


Для того, чтобы при наведении на ссылку курсором и при клике она меняла свой цвет в тэг <body> нужно добавить несколько параметров:

<body text=#0c00ff bgcolor=#faf0e6 link="blue" alink="purple" vlink="red">

Здесь:
link - цвет ссылки;
vlink - цвет пройденной ссылки;
alink - цвет активной ссылки, когда к ней подводиться курсор.


Текстовым ссылкам можно задать цвет тэгом <font> и его атрибутом color:

<a href="photo.html"><font color="#cc0000"> мои фотографии </font></a>.

Чтобы страница, на которую указывает ссылка, открывалась в новом окне, вставляем атрибут target="_blank":

<a href="имя.html" target="_blank"> показать </a>

<html>
<head>
<title>текстовая ссылка</title>
</head>
<body bgcolor=#faf0e6>
<img src=image/03.gif align=left height=200 hspace=30 vspace=5 alt="расслабься">
<div align="center">
<h2>Привет всем!</h2>
<div align=justify>Сайтик разрастается. Сделал еще несколько страниц, связал их ссылками. <a href="10_link_2p.html" target="_blank">Посмотрите</a>, что получилось.</div>
<font color=#cc0000 size=+1><b><i>Успехи налицо! Да здравствует HTML!</b></i></font>
</div>
</body>
</html>


Cмотрим, что получилось, жмем на ссылку, открываем еще одну страницу. На ней две ссылки.

Маленькая картинка в рамочке - ссылка-рисунок:

<a href=11.html><img src=image/10a.gif align=right height=50 hspace=60 alt="жизненные принципы"></a>

А это ссылка на почтовый ящик -

<a href=mailto:address@mail.ru>пишите письма</a>

Почтовую ссылку можно оформить и так:

<a href="mailto:address@mail.ru?subject=Hi &Body=Желаю познакомиться! &cc=copy@mail.ru &bcc=hidden_copy@mail.ru">пишите письма</a>

После щелчка на такую ссылку, откроется окно почтовой программы с уже заполненными полями.

Здесь:

  • ?subject=Hi - тема письма;
  • &Body=Желаю познакомиться - текст сообщения;
  • &cc=copy1@mail.ru,copy2@mail.ru - копии письма в другие адреса;
  • &bcc=hidden_copy3@mail.ru,hidden_copy4@mail.ru - скрытые копии письма в другие адреса.


    Примечание: По умолчанию вокруг ссылки-рисунка ставится рамка. Чтобы убрать ее, достаточно добавть параметр border=0 к списку аргументов рисунка.


    на следующую страницу  
  • Основы HTML
      
    Hosted by uCoz