Стили ссылок css

Стили ссылок css, это одна из возможностей, которая предоставляется нам css, для того что бы влиять на внешний вид всех имеющихся ссылок на сайте.

Начнём с того, что все ссылки, имеют четыре разных состояния, на внешний вид этих состояний, мы и можем повлиять с помощью стилей ссылок css.

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

Всё это как раз и регулируется в таблицах стилей.

Давайте уясним теперь более конкретными словами эти стилевые состояния ссылок.
Первое состояние, это когда до ссылки не дотрагиваются.
Второе, когда на ссылку наводят курсор.

Третье, состояние в момент нажатия на ссылку, это ещё называют, активное состояние ссылки.
Четвёртое, это когда ссылка уже посещена.

Ну хорошо, теперь посмотрим на эти стили ссылок css, изнутри, на реальных примерах:

a:link {color:#CC0000 ; text-decoration:underline;}

Чуть выше мы видим стиль не посещенной ссылки, У неё стоит красный цвет, "color:#CC0000", далее ей задано подчёркивание с низу, "text-decoration:underline".

Стиль посещенной ссылки, придаётся следующим образом:

a:visited {color:000000; text-decoration:none;}

В этом примере выше, посещенная ссылка должна быть чёрным цветом, "color:000000", какие либо подчеркивания её отменены, "text-decoration:none;".

Посмотрим теперь на состояние ссылки, при наведении на неё мыши:

a:hover {color:green; text-decoration:overline;}

Когда на ссылку наведут курсор, то в данном случае он изменит цвет на зелёный, "color:green;" и одновременно, обретёт подчёркивание с верху, "text-decoration:overline;".

Осталось посмотреть, как придается стиль активной ссылке, в момент нажатия:

a:active {color:orange; text-decoration:none;}

Данной ссылке в момент нажимания на неё, задали оранжевый цвет, "color:orange;", возможные подчеркивания отменены, "text-decoration:none;".

Вот вы и узнали основы про стили ссылок css, конечно, существуют и ёще более сложные и разнообразные стили, которые можно придавать ссылкам, просто если обо всём этом писать, то у меня уйдет уйма времени, а мне так лень заниматься этой писаниной, мой искренний совет тем, кто хочет создать сайт и стать хорошим веб мастером, разбирающимся во всех этих премудростях, изучайте видеокурсы, они намного эффективнее всех книг, там вам покажут и расскажут, а так же растолкуют на реальных живых примерах, что и к чему.

На этом сайте собраны для вас, лучшие видеокурсы данной тематики, с ними можно ознакомится в разделе "Видеокурсы", желаю вам приятного обучения и реализации всех ваших благих целей.

До встречи в следующих уроках.