Вам понадобится
  • Базовые знания языков HTML и CSS
Инструкция
1
Подготовьте блок описания стилей для гиперссылок. В самом простом виде он может выглядеть, например, так:a {color: Green}Здесь "a" называется «селектором», который указывает, что содержащееся в скобках описание стиля должно быть применено ко всем тегам ссылок в документе. Green определяет цвет ссылки.Это очень грубое определение цвета, которое применяется редко. Намного чаще в селектор "a" добавляется «псевдокласс» - это метка, которая позволяет указать стиль ссылки в трех разных состояниях.
2
Используйте псевдокаласс link, чтобы задать стиль для обычного (неактивного) состояния ссылки. Выглядеть это может, например, так:a:link {color: Green}
3
Используйте псевдокаласс hover, чтобы указать, как должна выглядеть ссылка при наведении курсора мыши. Например:a:hover {color: Lime}
4
Используйте псевдокаласс visited для описания стиля уже посещенной ссылки. Например:a:visited {color: DarkGreen}
5
Объедините все три состояния в один блок описания стилей. Выглядеть HTML-код, содержащий CSS-описания стилей может, например, так:<style type="text/css">
a:link {color: Green}
a:visited {color: DarkGreen}
a:hover {color: Lime}
</style>Здесь открывающий и закрывающий HTML-теги style сообщают браузеру, где начинается и заканчивается описание стилей, а между ними помещено описание поведения ссылок в трех состояниях.
6
В образце, использованном выше, указаны только цветовые характеристики, но в описание можно включить и другие атрибуты. Например, если дизайн страницы требует, чтобы в нормальном (неактивном) состоянии ссылка не была подчеркнута, а при наведении курсора подчеркивалась, то код можно модифицировать так:<style type="text/css">
a:link {color: Green; text-decoration: none;}
a:visited {color: DarkGreen; text-decoration: none;}
a:hover {color: Lime; text-decoration: underline;}
</style>
7
Если требуется изменить цвет только некоторых ссылок в странице, а остальные оставить с установками по умолчанию, то в тег каждой изменяемой ссылки надо добавить атрибут class. Например, назовите этот класс гиперссылок именем newLinks. Тогда тег ссылки может выглядеть так:<a class="newLinks" href="https://www.kakprosto.ru/">текстовая ссылка</a>Это же имя класса надо добавить и в описание стилей:<style type="text/css">
a.newLinks:link {color: Green; text-decoration: none;}
a.newLinks:visited {color: DarkGreen; text-decoration: none;}
a.newLinks:hover {color: Lime; text-decoration: underline;}
</style>
8
Поместите подготовленный на основе описанных выше образцов код описания стилей в заголовочную часть страницы - между тегами <head> и </head>. При необходимости добавьте в теги ссылок атрибут class с именем, использованным в описании стилей. Затем сохраните измененную страницу, и процедура изменения цвета гиперссылок будет завершена.