Работа с ссылками css на сайте.

На этом уроке рассмотрим, как применять стиль CSS к ссылкам на сайте. Пошаговые уроки с примерами.

Давайте посмотрим как применить стиль CSS к ссылкам на html сайте, используем для этого элемент a:. Здесь мы как и в предыдущих уроках используем файл style.css где мы и задаём стиль с помощью таблицы стилей CSS. Ниже приведены значения для применения стиля к ссылкам меняя их цвет при различных вариантах использования.

1) link - задаём цвет ссылке который ещё не посещали.
2) hover - задаём цвет ссылке при наведении на неё.
3) active - задаём цвет ссылке при нажатии на неё.
4) visited - задаём цвет ссылке который уже посетили.

Здесь в нашем примере которая находится ниже мы ещё используем дополнительное свойство text-decoration:none; обозначающую, что ссылки css на странице не использует декорацию и они будут без подчёркивания. Для просмотра дополнительных возможностей применения свойства text-decoration: вы можете посетить урок где мы изучали варианты оформления текста с применением стиля CSS.

Пример содержание файла style.css.


a:link {color: blue;text-decoration:none;}
a:hover {color: green;text-decoration:none;}
a:active {color: red;text-decoration:none;}
a:visited {color: olive;text-decoration:none;}
 

Итог нашего примера приминения стиля css к ссылкам вы можете сами посмотреть на своём сайте, в результате мы увидим как меняется цвета ссылок в зависимости от того какое действие будет применено к ссылке.

Следующий урок. СПИСКИ В CSS
Предыдущий урок. ЦВЕТ И ФОН В CSS



Рейтинг@Mail.ru   Яндекс.Метрика