Как задать цвет ссылок?
Для изменения цвета ссылок используйте стилевое свойство color, добавляя его к селектору A , как показано в примере 1.
Пример 1. Изменение цвета ссылок
Для сборки мегадроида требуется открыть коробку, достать мешочек с микросхемами и сложить их в нужном порядке, пользуясь нашим подробным 8631-страничным руководством.
Результат данного примера показан ни рис. 1.
Рис. 1. Вид ссылок, у которых изменён цвет
См. также
- color
- currentColor
- text-decoration-skip-ink
- text-fill-color
- Атрибут link
- Атрибуты ссылок
- Единицы цвета в CSS
- Использование :hover
- Наследование в CSS
- Работа с типографикой
- Создание ссылок
- Ссылки
- Ссылки
- Ссылки в HTML
- Якоря
CSS цвет ссылки, подчеркивание ссылок, картинка — ссылка
CSS подчеркивание ссылок определяется text-decoration и его значениями:
| Ссылка
|
Атрибут text-decoration имеет такие значения: underline – гиперссылка подчеркнута; overline – надчеркнута и none – стиль без декораций.
a:link, a:active – псевдоэлементы, которые определяют первоначальный вид ссылки и в момент нажатия (текст синего цвета, полужирный, по умолчанию подчеркнут).
Псевдоэлемент a:visited определяет уже посещенную ссылку (в данном случае текст зеленый, полужирный и подчеркнутый).
Псевдоэлемент a:hover определяет внешний вид ссылки при наведении на нее курсора мыши (текст красный, полужирный, без декораций).
Определяем CSS цвет ссылки
CSS цвет ссылки определяется атрибутом color и его значениями:
| Текст со ссылкой
|
Селектор a соединяет в себе а:link, а:visited, a:active .
CSS картинка — ссылка
CSS картинка — ссылка определяется картинкой и тегами гиперссылки:

border=»0″ – отменяет границу картинки — ссылки и стили здесь не участвуют.
Автор проекта — Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018
CSS текст по вертикали
CSS ссылка, гиперссылка
CSS ссылка и курсор
© 2009 — 2023 | При использовании материала, ссылайтесь на мой сайт!
По всем вопросам обращайтесь: go@ab-w.net | Стиль CSS ссылки картинки? – Не вопрос!
Как изменить цвет ссылки и фона под ней?
Используйте стилевое свойство color для задания цвета текста и background для изменения цвета фона под ссылкой, добавляя их к селектору A , как показано в примере 1.
Пример 1. Изменение цвета ссылок
HTML5 CSS 2.1 IE Cr Op Sa Fx
Цвет ссылок Для сборки мегадроида требуется открыть коробку, достать мешочек с микросхемами и сложить их в нужном порядке, пользуясь нашим подробным 8631-страничным руководством.
Результат данного примера показан ни рис. 1.

Рис. 1. Вид ссылок, у которых изменён цвет и фон
В случае добавления к ссылке фона желательно установить поля с помощью свойства padding , чтобы текст не прилегал плотно к краю цветной области.
HTML по теме
CSS по теме
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.
Популярные рецепты
Как добавить картинку на веб-страницу?
Как добавить иконку сайта в адресную строку браузера?
Как добавить фоновый рисунок на веб-страницу?
Как сделать обтекание картинки текстом?
Как растянуть фон на всю ширину окна?
Как выровнять фотографию по центру веб-страницы?
Как разместить элементы списка горизонтально?
Как убрать подчеркивание у ссылок?
Как убрать маркеры в маркированном списке?
Как изменить расстояние между строками текста?
Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
Как открыть ссылку в новом окне?
HTML Ссылки цветные
HTML ссылка отображается другим цветом в зависимости от того, была ли она посещена, не посещена или активна.
HTML Цвет ссылок по умолчанию
По индексу ссылка будет выглядеть так (во всех браузерах):
- Непосещенная ссылка подчеркнута синим цветом
- Посещенная ссылка подчеркнута фиолетовым цветом
- Активная ссылка подчеркнута красным цветом
Вы можете изменить цвета состояния ссылки, используя CSS:
Пример
Здесь непосещенная ссылка будет зеленой без подчеркивания. Посещенная ссылка будет розовой без подчеркивания. Активная ссылка будет желтой и подчеркнутой. Кроме того, при наведении курсора мыши на ссылку ( a:hover ) она станет красной и подчеркнутой:
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;
>
Кнопка ссылки
Ссылка также может быть стилизована как кнопка с помощью CSS:
Пример
Чтобы узнать больше о CSS, перейдите на CSS Учебник.
HTML Тег ссылка
| Тег | Описание |
|---|---|
| Определяет гиперссылку |
Для получения полного списка всех доступных HTML тегов посетите HTML Справочник тегов.
