Ссылки в CSS



Каждый, кто бывает в интернете видит, что при наведении на ссылку она меняет цвет или другое свойство. это достигается использованием различных свойств CSS. Для этого используют псевдоклассы.

Правилами установлено правильное написание: записываем элемент А, к которому применяем псевдокласс, затем двоеточие, указываем имя псевдокласса, а затем в фигурных скобках - нужный стиль.


Пример записи кода:

А : ИМЯ ПСЕВДОКЛАССА { ..стиль ..}

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

Пример записи кода:

A:link {..стиль оформления обычной ссылки..} A:active {..стиль оформления ссылки в момент нажатия..} A:visited {..стиль оформления посещенной ссылки..} А:hover {..стиль оформления ссылки, на которую наведен указатель мыши ..}

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


Пример записи кода:

a:link { color:blue; } a:visited { color:grey; } a:hover { color:red; text-decoration:none; /*Отменяем подчеркивание*/ } a:active { color:green; text-decoration:none; /*Отменяем подчеркивание*/ }

РЕЗУЛЬТАТ В БРАУЗЕРЕ:

    ПРИМЕР

Если для всех псевдоклассов стиль применяем одинаковый. то можно записать кратко.


Пример записи кода:

a:link,a:visited,a:hover,a:active { color:red; text-decoration:none; /*Отменяем подчеркивание*/ }

А можно еще проще:


Пример записи кода:

a{ color:red; text-decoration:none; /*Отменяем подчеркивание*/ }

Далее рассмотрим: Блоки в CSS