Модератор
Злыдень немрущий
|
Дабы прекратить раздувание темы, объясню в кратце. Итак,
a{...} - действует на все ссылки в документе и на все виды (см.ниже).
a:что-то {...} - действует на все ссылки в документе определённого вида. Под видом понимается, как говорил
Alex Spade, следующие названия:
link - не просмотренная ссылка
visited - просмотренная
active - на которую нажимают
hover - на которую наводят мышь
Т.е. a{color: red;} сделает все ваши ссылки красного цвета. Стили применяются последовательно, т.е. если вы напишите a{color: red;}, а потом a{color: green;}, то все ссылки будут зелёного цвета. Далее, при наведении используется hover. Выглядит как
a{color: red;}
a:hover{color: green;}
Это означает, что все ссылки красные, а при наведении на них, они станут зелёными.
Так, с этим разобрались. Теперь классы. Классы действуют только на те объекты, в которых указан class. Классы в стилях начинаются с точки. Итак, все ссылки у нас красные. Пишем следующую строку: .myclass{color:blue;}, а в ссылке пишем <a href="#" class="myclass">новый линк</a> и видим, что этот линк стал синего цвета, в то время как все остальные красные. На классы действует hover и еже с ним, если этот класс применяется к ссылкам. Например, .myclass:hover{color:yellow} задаёт всем ссылкам, у которых прописан class=myclass, что при наведении на них эти ссылки будут жёлтыми.
Порой бывает, что нужно создать таблицу или область, в которой ссылки должны быть другого цвета, отличного от цвета всех ссылок. Да, можно каждой ссылке прописать класс, но это неудобно. Можно сделать проще. Создадим область, вернее контейнер div.
<style>
a{color:red;}
a:hover{color:green;}
.toDiv a {color: blue;}
.toDiv a:hover{color:yellow;}
</style>
Теперь создаём контейнер <div> с классом toDiv и пишем в нём несколько ссылок.
<a href="#">обычный линк</a>
<div class="toDiv">
<a href="#">линк в DIV'е</a>
<a href="#">линк в DIV'е</a>
</div>
Видим, что первый линк красный, остальные два синие. Заметьте, что в стилях указана не запятая, а пробел. Запятая - это перечисление к кому относится данный стиль, а пробел указывает, что в контейнере с классом toDiv содержатся <a> и к последним применяется данный стиль.
Теперь добавим таблицу, в которой нужно изменить цвет ссылок. Добавим это в наш стиль.
<style>
.toTable a{color:blue;}
.toTable a:hover{color:yellow;}
</style>
А теперь сама таблица.
<a href="#">обычный линк</a>
<table class="toTable">
<tr><td><a href="#">линк в таблице</a></td></tr>
<tr><td><a href="#">линк в таблице</a></td></tr>
</div>
Далее, стили можно указывать и по id. В стилях передименем пишется номер, а в ссылке пишется id="имя"
<style>
#myID {color:red;}
</style>
<a href="#" id="myID">линк в DIV'е</a>
Комментировать строки в стилях можно ставя перед строкой собаку, но лучше так: /* это закомментировано */
Есть несколько НО. Во-первых, чтобы цвета работали, должен быть прописан href в ссылках. Во-вторых, нельзя использовать в ссылках <font> и еже с ним (цвета работать не будут). Всё задаётся в стилях. В-третих, стили дополняют друг друга, а не заменяют. Заменяется только то, что было уже указано. Т.е. если вы написали a{color:red;text-decoration:none;}, а потом a{color:green;}, то ссылка будет без подчёркивания и зелёная. В-четвёртых, hover и еже с ним (в общем всё то, что пишут после двоеточия) работает ТОЛЬКО на тэг <а>.
ps: Думаю, что описАл понятно. Если есть вопросы, обращайтесь в аську. Только сначала сами помучайтесь, перечитайте этот пост, а потом уже в асю.
|
