HTML, Excel, Word, SEOОсновы HTML ⇒ Гиперссылки

Основы CSS

Учебник CSS
· Что такое CSS?
· Структура html-страницы
· Шрифт: размер и гарнитура
· Выравнивание и пробелы
· Начертание шрифта
· Оформление ссылок
· Форматирование списков
· Классы
· Изображения
· Справочник атрибутов CSS

Основы HTML

  1. Термины и определения
  2. Принципы WEB 2.0
  3. Структура HTML-документа
  4. Основные метатеги
  5. Форматирование текста HTML
  6. Списки
  7. Текст фиксированного формата
  8. Выделение фрагментов текста
  9. Изменение параметров шрифта
  10. Графика
  11. Таблицы
  12. Гиперссылки
  13. Изображения-карты
  14. Фреймы

Основы CSS3

  1. Что такое CSS
  2. Синтаксис CSS
  3. Стилевые классы
  4. Комбинированные стили
  5. Таблицы CSS
  6. Правила каскадности CSS
  7. Рекомендации применения стилей
  8. Параметры шрифтов
  9. Разрывы строк, вертикальное выравнивание
  10. Параметры фона
  11. Параметры абзаца
  12. Параметры списков
  13. Параметры курсора
  14. Параметры отступов
  15. Параметры рамки
  16. Параметры выделения
  17. Параметры отображения
  18. Контейнеры



Гиперссылки

Гиперссылки - основа Интернета. Именно благодаря гиперссылкам Интернет стал "всемирной паутиной". Гиперссылки связывают воедино отдельные html-страницы в WEB-сайты из которых и состоит Интернет.

В окне бразуера стандартная текстовая гиперссылка выглядит как подчеркнутый текст синего цвета. При наведении курсора мышки на гиперссылку она принимает вид "указательного пальца". При щелчке на гиперссылке браузер обычно переходит к другой html-странице, URL-адрес которой указан в параметре гиперссылки. Гиперссылка может быть не только текстовой, но и графической.

Текстовые гиперссылки

Создать текстовую гиперссылку очень просто. Для создания гиперссылки достаточно заключить внутрь тега <А> любой фрагмент текста.

ПРИМЕР 1:

<p>
Эта <a href="index.html">гиперссылка</a> 
ведет на главную страницу сайта.
</p>

Если ссылка должна быть открыта в новом окне браузера, используют атрибут target со значением "_blank":

ПРИМЕР 2:

<p>
Эта <a href="index.html" target="_blank">гиперссылка</a> 
будет открыта в новом окне браузера.
</p>

Атрибут href со значением # формирует "пустую" ссылку, которая никуда не ведет.

ПРИМЕР 3:

<p>
Эта <a href="#">гиперссылка</a> 
никуда не ведет.
</p>

Правила отображения стандартных гиперссылок:

Все эти значения можно изменить.

Почтовые гиперссылки

Щелчок на почтовой гиперссылке запускает почтовый клиент, который установлен в операционной системе на компьютере по умолчанию. Если нужно открыть почтовый адрес user@gmail.com - гиперссылка должна выглядеть следующим образом:

ПРИМЕР 4:

<p>
Это <a href="mailto:user@gmail.com"> почтовая гиперссылка</a> 
</p>

Обратите внимание, что атрибут href почтовой гиперссылки не должен содержать пробелов.

Графические гиперссылки

В качестве гиперссылки может выступать изображение или его фрагмент.

ПРИМЕР 5:

<p>
<a href="index.html"><img src="image1.png"></a> 
</p>

Правила вывода изображений-гиперссылок:

Якоря

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

Якорь создается, как и гиперссылка, но вместо атрибута href помещают атрибут ID. Атрибут ID должен быть уникальным в пределах текущей html-страницы.

Якорь является "пустым" тегом, внутрь него не помещается ничего.

<p>
text
<a ID="anchor-1"></a> 
text
</p>

Гиперссылка, которая ведет на якорь, имеет следующий вид:

<a href="index.html#anchor-1">переход к якорю-1</a>

Если гиперссылка и якорь находятся на одной html-странице:

<a href="#anchor-1">переход к якорю-1</a>

Если гиперссылка и якорь находятся на разных сайтах:

<a href="http://site.index.html#anchor-1">переход к якорю-1</a>

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



В начало страницы



В начало страницы