Отправляет email-рассылки с помощью сервиса Sendsay

Рецепты HTML

  Все выпуски  

Рецепты HTML


Служба Рассылок Subscribe.Ru
Рецепты HTML
http://html.krsk.ru

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

Факт: Чтобы ваши цвета на веб-странице не изменялись браузером, используйте 216 цветов веб-палитры.

Добрый день.
Сегодня продолжение статьи, посвященным созданию разных по типу ссылок на одной странице. Полный текст размещен по адресу http://html.krsk.ru/css/links2.asp

Такие разные ссылки

Дополнение к вышеописанному мне прислал VinnyNov (Vinny@mail.novgorod.ru) уже после опубликования данной статьи.
Замечание: если цвет в каскадной таблице указывать у ссылки (тега <a>), то замечены глюки в Нетскейпе (цвет ссылки не меняется) и Опере (цвет черты подчеркивания ссылки не меняется), поэтому для надежности я использую вложенный внутрь ссылки тег <div> с прописанным в каскадной таблице цветом.

Пример 3. Использование вложенного тега DIV
<html>
<head>
<style>
.Red { font-size: 14px; color: red }
</style>

<body link=#0000ff>
<a href="..."><div class="Red">Red Link</div></a>
</body>

Согласен с Vinny и спасибо ему за замечание и дополнение к данному материалу.

Одно из наиболее популярных применений CSS - это убирание подчеркивания у ссылок. С позиции юзабилити не совсем верное решение, поскольку пользователь может сразу не догадаться, что текст, который он видит, является ссылкой. Все ведь уже привыкли - раз подчеркивание используется, значит это ссылка. Но при правильном применении отсутствие подчеркивания у ссылок может придать определенный эффект сайту. Часто делается, что при наведении курсора, ссылка становится подчеркнутой, меняет свой цвет или используется и то и другое одновременно. При создании двух и более типов ссылок можно воспользоваться селектором hover, однако, этот параметр не работает в Netscape до 6 версии, поэтому его следует использовать осторожно.

Пример 4. Использование параметра HOVER

<html>
<head>
<style>
a.link1 { color: green; text-decoration: none }
a:hover.link1 { text-decoration: underline; color: red }
a.link2 { color: blue; }
a:hover.link2 { color: black }
</style>

<body link=#0000ff>
<p><a href=link1.html class=link1>Ссылка 1</a>
<p><a href=link2.html class=link2>Ссылка 2</a>
</body>

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

| Ссылка 1 | Ссылка 2 |


Рекомендую подписаться на рассылку:
Каскадные таблицы стилей

Copyright Влад Мержевич. По всем вопросам пишите мне по адресу inferos@mail.ru


http://subscribe.ru/
E-mail: ask@subscribe.ru
Отписаться
Убрать рекламу
Рейтингуется SpyLog

В избранное