HTML ссылки — гиперссылки, ссылка на сайт

HTML теги, определяющие HTML ссылки

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

HTML ссылки связывают между собой миллиарды web-страниц и миллионы сайтов.
HTML ссылки определяются тегами <a> </a>.
HTML ссылки могут быть любого размера и цвета – свойства определяются с помощью CSS.
HTML ссылка может быть текстовой или изображением.

Навигация по странице

HTML ссылка на другую страницу сайта
HTML ссылка на сайт
HTML ссылки внутри страницы сайта
HTML изображение-ссылка

HTML ссылка на другую страницу сайта

Пример:

Используя полученные знания, сделайте в Блокноте наброски будущей страницы ⇒ сохраните ее под произвольным именем, например, как page2.html в папке D\My_first_site.
В другом документе, опять же в Блокноте, пропишите:

...

          <title>HTML ссылка на другую страницу</title>

          </head>

          <body>

          <p><a href="page2.html">Переходим</a> на вторую страницу</p>

          </body>

          </html>

Сохраните его как index.html. В итоге, папка D\My_first_site содержит файлы: index.html и page2.html.
Откройте в браузере файл index.html ⇒ нажмите на ссылку.

HTML ссылка на сайт

Пример:

...

          <title>HTML ссылка на сайт</title>

          </head>

          <body>

          <p>Посетите <a href="/">ab-w.net</a></p>

Атрибуты и значения

href="" – обязательный атрибут тега <a>, указывает адрес ссылки.
target="_blank" – откроет ссылку в новом окне браузера:

<a href="page2.html" target="_blank"> </a>

target="_self" – откроет ссылку в том же окне. Значение _self определено по умолчанию, поэтому его можно не указывать.
title="комментарий" – всплывающий комментарий – заголовок ссылки:

<a href="page2.html" target="_blank" title="комментарий"> </a>

HTML ссылка может быть окрашена в любой цвет, что подробно рассматривается в курсе по CSS.

HTML ссылки внутри документа

Буквы-ссылки в главе HTML теги осуществляют переход в пределах одной интернет-страницы.

Как это реализовано:

Имеем 2-е буквы D. Первая выступает в роле HTML ссылки, а вторая – в роли элемента на который ссылаемся. Второй присваиваем идентификатор со значением:

<h2 id="d">D</h2>

Код ссылки на букву с идентификатором:

<a href="#d">D</a>

HTML изображение-ссылка

Следующее изображение является ссылкой наверх страницы:

Код:

<title>HTML изображение в роле ссылки</title>

          </head>

          <body>

          <p>

          <a href="#"><img src="../images/strelkavverx.png" alt="" border="0" /></a>

          </p>

border="0" – отменяет границу у изображения-ссылки.

Автор проекта - Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018

HTML верстка сайта HTML ссылка на сайт HTML изображение-карта