FAQ по оформлению ссылок (линки, links) - [2] :: В помощь вебмастеру

Народ! Помогите кто-нибудь с CSS... Сделал CSS файл в нем прописано
Цитата:
A:link {COLOR: #ffffff; CURSOR: hand; TEXT-DECORATION: none}

Как мне теперь сделать, чтобы у ОДНОЙ конкретной ссылки был другой цвет, естественно отличный от установленного? (и hover, и link и visited...)

FAQ по оформлению ссылок

За подчеркивание или неподчеркивание ссылки отвечает параметр text-decoration, который может принимать значения:

Цитата:

none - не подчеркивать
underline - подчеркивать снизу (по умолчанию)
overline - подчеркивать сверху
line-through - зачеркивать
blink - мигать

За цвет текста ответает параметр color, который может принимать значение шестнадцатеричного числа или имени цвета:
color:#000000;
color:black

'background'

'border'

'font'
И т.д. -> http://loc.stack.ru/projects/CSS2/

Пример.
Ссылка по умолчанию не подчеркнута, подчеркивается при наведении.

Код:

a{font-family:Verdana, Arial; font-size:9pt; text-decoration:none; margin:0pt;}
a:link {color:#0000cc;}
a:hover {text-decoration:underline;}
a:active {color:#ff0000; text-decoration:underline;}
a:visited {color:#000066;}

Вопрос:
Цитата:

Нужно чтобы на странице было несколько типов оформления посещенных и активных ссылок.
Например:
1. Красные (visited) и зеленые (active)
2. Синие(visited) и желтые(active)

Ответ:
Для каждого нужного тебе варианта создаешь отдельный класс:

Код:

a.main {font-family:Verbana, Arial; font-size:10pt; text-decoration:none; margin:0pt;}
a:link.main {color:#0000cc;}
a:hover.main {text-decoration:underline;}
a:active.main {color:#ff0000; text-decoration:underline;}
a:visited.main {color:#000088;}

a.main1 {font-family:Verdana, Arial; font-size:8pt; text-decoration:none; margin:0pt;}
a:link.main {color:#0000cc;}
a:hover.main {text-decoration:underline;}
a:active.main {color:#ff0000; text-decoration:underline;}
a:visited.main {color:#000088;}

a.other {font-size:10pt; font-family:Verdana, Times New Roman; text-decoration:none;}
a:link.other {color:#0000dd;}
a:hover.other {text-decoration:underline; color:#0000ff;}
a:active.other {color:#ff0000; text-decoration:underline;}
a:visited.other {color:#5500aa;}

a.reestr {font-size:8pt; font-family:Verdana, Times New Roman; text-decoration:none; text-align:center;}
a:link.reestr {color:#0000dd;}
a:hover.reestr {text-decoration:underline; color:#0000ff;}
a:active.reestr {color:#ff0000; text-decoration:underline;}
a:visited.reestr {color:#5500aa;}

И потом:

Код:

Вопрос:
Цитата:

почему посещеные сылки уже не меняют цвет, когда наводишь, в то время как НЕпосещеные меняют?

Решение:

Цитата:

a:link {color: #0000FF}
a:hover {color: #FF0000}
a:visited {color: #0000FF}
a:visited:hover {color: #FF0000}

Чтобы предупредить дальнейшие вопросы, советую ознакомиться с
ресурсами по CSS


http://htmlbook.ru/html/links/index.shtml

CSS » FAQ по оформлению ссылок

a:link,a:active,a:visited {
background-color: blue;
width: 100%;
height: 100%
}
a:hover {
background-color: red;
width: 100%;
height: 100%
}

эксперементируйте!

Модерирует : Cheery
Версия для печати • Подписаться • Добавить в закладки
Страницы: 1 2