Введите ваш адрес почты


sdcvoy.ru
Понравился сайт? Поделись с друзьями!
Главная » Html » Atributy-ssylok

Атрибуты ссылок

С основным атрибутом тега <a> вы уже познакомились в предыдущем уроке — это href. Давайте с вами рассмотрим еще несколько атрибутов, которые вы также сможете использовать, но которые не являются обязательными.

И первый атрибут, который мы с вами рассмотрим будет target. По умолчанию, при переходе по ссылке документ открывается в текущем окне или фрейме, но используя target вы с легкостью сможете контролировать где откроется данная ссылка.

В качестве зарезервированных имен применяются следующие значения:

Вот вам небольшой пример, как используется данный атрибут

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html;
 charset=utf-8">
  <title>Ссылка в новом окне</title>
 </head>
 <body>
  <p><a href="document.html" target="_blank">Открываем ссылку в 
новом окне</a></p>
 </body>
</html>

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html;
 charset=utf-8">
  <title>Дополнение к ссылке</title>
 </head>
 <body>
  <p><a href="document.html" title="Этот документ является
 файлом HTML">Документ</a></p>
 </body>
</html>

При наведении на ссылку вы должны увидеть надпись заключенную в title.

 

Думаю вам полезно будет знать, что для ссылки на почтовый адрес, необходимо перед адресом почты в href поставить ключевое слово malito.


<a href="mailto:nightgremlin2007@yandex.ru">Можете отправить 
мне письмо</a>

Для создания якоря используется атрибут id. В качестве примера перехода на другую страницу с использованием якоря может послужить следующий пример:

Страница на которую следует перейти, назовем её index.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
  <meta http-equiv="Content-Type" content="text/html;
 charset=utf-8">
  <title>Быстрый переход внутри документа</title>
  </head>
  <body>
  <p><a id="top"></a></p>
  <p>Контент</p>
  <p><a href="#top">Наверх</a></p>
  <p><a name="bottom"></a></p>
  </body>
  </html>

А эта страница с которой мы делаем переход, назовем её document.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
   <meta http-equiv="Content-Type" content="text/html;
 charset=utf-8">
   <title>Якорь в другом документе</title>
 </head>
 <body>
  <p><a href="document.html#bottom">Перейти к нижней части
 текста главной страницы</a></p>
  </body>
</html>

Как вы могли заметить, на главной странице тоже есть переход с помощью якоря, но этот переход осуществляется в рамках данной страницы.

В следующем уроке мы поговорим с вами о графике и изображениях в html.



наверх