CSS: Урок 6. CSS ссылки | Форматируем ссылки

Пятница, 10 Декабря 2010 г. 16:31 + в цитатник

CSS атрибуты, определяющие CSS ссылки

В CSS ссылки также поддаются форматированию:

Еще пример:

                                  <head>

            <style type="text/css">

            a:link, a:active {

            color:#0000ff;

            font-weight:bold

            }

            a:visited {

            color:#66cc66;

            font-weight:bold

            }

            a:hover {

            color:#ff0000;

            font-weight:bold;

            text-decoration:none

            }

            </style>

                              </head>

            <body>

            <p><a href="#">Ссылка</a></p>

            </body>

Результат: ссылки в CSS

a:link, a:active – псевдоэлементы, которые определяют первоначальный вид ссылки и в момент нажатия (текст синего цвета, полужирный, по умолчанию подчеркнут).

Псевдоэлемент a:visited определяет уже посещенную ссылку (в данном случае текст зеленый, полужирный и подчеркнутый).

Псевдоэлемент a:hover определяет внешний вид ссылки при наведении на нее курсора мыши (текст красный, полужирный, без декораций).

Еще один пример с псевдоэлементом a:hover:

                                  <head>

            <style type="text/css">

            .primer a {

            color:#ff6600

            }

            .primer a:hover {

            color:#6600ff

            }

            </style>

                              </head>

            <body>

            <p class="primer">Текст со <a href="#">ссылкой</a></p>

            </body>