9. CSS-ссылки

CSS-ссылки содержат свойства, которые отвечают за внешний вид гипертекстовых ссылок HTML-документа. Основной способ оформления ссылок заключается в стилизации подчеркивания ссылки и изменении цвета текста ссылки. Также можно изменить внешний вид курсора с помощью свойства cursor.

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

Большинство браузеров выделяют четыре основных состояния гиперссылок, каждому из которых соответствует свой псевдокласс селектора:

  • Непосещенная — a:link
  • Посещенная — по которой уже выполнялся переход — a:visited
  • Не нажатая — над которой находится указатель мыши — a:hover
  • Нажатая — которая удерживается мышью — a:active

Используя псевдоклассы для форматирования каждого состояния ссылок, можно дать пользователям подсказки, по каким ссылкам он уже переходил, а по каким — ещё нет, например:

a:hover {
  color: #154088; 
  border-bottom: .07em solid;
}

Подчеркивание ссылок

Удаление подчеркивания:

a {
  text-decoration: none;
}

Добавление подчеркивания только при наведении на ссылку:

a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}