Ссылки находятся практически во всех веб-страницах. Ссылки позволяют пользователям щелкать путь от страницы к странице.
HTML Ссылки Описание
гиперссылка, или просто ссылка, является ссылкой на данные, которые читатель может непосредственно следовать либо щелкнув, нажав или зависание.
Гиперссылка указывает на весь документ или конкретного элемента в пределах документа. Гипертекст представляет собой текст с гиперссылками. Текст, который связан с называется якорным текстом.
Система программного обеспечения, которое используется для просмотра и создания гипертекста является гипертекстовой системой, и создать гиперссылка является гиперссылка (или просто ссылка). Пользователь гиперссылка называются навигация или просмотр гипертекста.
HTML Ссылки - Гиперссылки
HTML ссылки являются гиперссылками.
Гиперссылка является текст или изображение, которое вы можете нажать на, и перейти к другому документу.
HTML Ссылки - Синтаксис
В HTML, ссылки определяются с <a> тегом:
<a href=" url "> link text </a>
href атрибут указывает адрес получателя (http://www.w3ii.com/html/default.html)
Текст ссылки является видимой частью (Visit our HTML tutorial) .
При нажатии на текст ссылки, отправит Вам по указанному адресу.
Текст ссылки не должен быть текст. Это может быть HTML изображения или любого другого элемента HTML.
Без лидирующий слэш на подпапку адреса, вы можете создать два запроса к серверу. Многие серверы автоматически добавит слэш по адресу, а затем создать новый запрос.
Локальные ссылки
В приведенном выше примере используется абсолютный URL (A full web address) - (A full web address) .
Локальная ссылка (link to the same web site) - (without http://www.... ) (link to the same web site) задается с относительным URL (without http://www.... ) .
HTML Ссылки - Цвета
При перемещении мыши по ссылке, две вещи, как правило, бывает:
- Стрелка мыши превратится в маленькую руку
- Цвет элемента ссылка изменится
По умолчанию, ссылка будет выглядеть следующим образом (in all browsers) :
- Непосещенная ссылка подчеркнутая и синий
- Посещаемая ссылка подчеркнутая и фиолетовая
- Активная ссылка подчеркнутая и красная
Вы можете изменить цвета по умолчанию, с помощью стилей:
пример
<style>
a:link {color:green; background-color:transparent; text-decoration:none}
a:visited {color:pink; background-color:transparent; text-decoration:none}
a:hover {color:red; background-color:transparent; text-decoration:underline}
a:active {color:yellow; background-color:transparent; text-decoration:underline}
</style>
Попробуй сам " HTML Ссылки - The target Атрибут
target атрибут указывает , где открыть связанный документ.
Этот пример будет открыть связанный документ в новом окне браузера или в новой вкладке:
Целевое значение | Описание |
---|---|
_blank | Открывает связанный документ в новом окне или вкладке |
_self | Открывает связанный документ в тот же кадр , как она была нажата (this is default) по (this is default) |
_parent | Открывает связанный документ в родительском фрейме |
_top | Открывает связанный документ в полном теле окна |
framename | Открывает связанный документ в указанной рамке |
Если веб - страница заблокирована в кадре, вы можете использовать target="_top" , чтобы выйти из рамы:
пример
<a href="http://www.w3ii.com/html/default.html" target="_top">HTML5 tutorial!</a>
Попробуй сам " HTML Ссылки - изображение как ссылку
Обычно использовать изображения в качестве ссылок:
пример
<a href="default.html">
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0">
</a>
Попробуй сам " граница: 0 добавляется для предотвращения IE9 (and earlier) отображать границы вокруг изображения.
HTML Ссылки - Создание закладки
HTML закладки используются, чтобы позволить читателю перейти к определенным частям веб-страницы.
Закладки практичны, если ваш сайт имеет длинные страницы.
Чтобы сделать закладку, вы должны сначала создать закладку, а затем добавьте ссылку на него.
При щелчке на ссылке, страница будет прокручиваться на месте с закладкой.
пример
Во- первых, создать закладку с id атрибута:
<h2 id="tips">Useful Tips Section</h2>
Затем добавьте ссылку на закладку ("Useful Tips Section") , в рамках одной и той же странице:
<a href="#tips">Visit the Useful Tips Section</a>
Или, добавьте ссылку на закладку ("Useful Tips Section") , с другой страницы:
Краткое содержание главы
- Используйте HTML - <a> элемент определить связь
- Используйте HTML href атрибут , чтобы определить адрес ссылки
- Используйте HTML target атрибут , чтобы определить , где открыть связанный документ
- Используйте HTML - <img> элемент (inside <a> ) , чтобы использовать изображение в качестве ссылки
- Используйте HTML id атрибута ( id=" value ") , чтобы определить закладки на странице
- Используйте HTML href атрибута ( href="# value ") для связи с закладкой
Проверьте себя с упражнениями!
Упражнение 1 » Упражнение 2» Упражнение 3 » Упражнение 4» Упражнение 5 »
HTML Link теги
Тег | Описание |
---|---|
<a> | Определяет гиперссылку |