Kamrad.ru
 
 
дневники | кабинет | регистрация | календарь | участники | faq | правила | поиск | фотоальбом | каська | выйти
Kamrad.ru Kamrad.ru » Авторские форумы » Веб-дизайн, вёрстка и веб-программирование » высвечивание ссылок
новая тема  ответить следующая тема | предыдущая тема
Автор
  << < 1 2 > >>
Arwen - offline Arwen
03-07-2003 04:44 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад



 высвечивание ссылок

Как в хтмл сделать так, чтобы когда наводишь на ссылку курсор, она высвечивалась другим цветом?
Foks - offline Foks
03-07-2003 08:14 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать
Intelligence Droid

Самый простой вариант, но может не самый лучший:
< HEAD>
< STYLE type="text/css">
A { text-decoration:none; }
A:active { text-decoration:none; }
A:visited { text-decoration:none; }
a:hover{color:#dc143c}
< /STYLE>
< /HEAD>
Dark - offline Dark
04-07-2003 03:26 URL сообщения Дневник     K-Mail    Профиль    Поиск    Контакт-лист   Редактировать
Камрад
Темная личность

<style>
A {color:#ff0000;}
A:hover {color:#00ff00;}
</style>

В данном случае нет ничего проще и лучше, чем CSS. Ссылка меняет цвет при наведении с красного на зелёный.

Foks
Параметр "text-decoration" относится к подчёркиванию, но никак не к цвету.
Alex Spade - offline Alex Spade
04-07-2003 11:16 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать
Модератор

В дополнение есть ещё понятие A:link
A:link, A:visited {color: #993333}
A:active, A:hover {color: #FF0000}

ЗЫ насколько я помню NНафигатор не понимает A:hover - поэтому в нём цвет не меняется.

link - не просмотренная ссылка
visited - просмотренная
active - на которую нажимают
hover - на которую наводят мышь
Arwen - offline Arwen
07-07-2003 02:53 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Чего-то не получается. Допустим строка выглядит вот так:
<p><b><a href="http://www.lalala.ru/blank/music.html"><i><font color="#FFFF00">Музыка</font></i></a></b></p>

"Музыка" должна выделятся при наведении. Как должна выглядеть эта строка?
Anafay - offline Anafay
07-07-2003 03:17 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
Это не в строке делается, а в заголовке документа. См. пример от Foks'а.
Arwen - offline Arwen
07-07-2003 07:31 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

В заголовке страницы, на которую ссылка или на странице, где расположена ссылка? Уточните плиз, а то опять не получилось.
Anafay - offline Anafay
07-07-2003 08:16 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
Между <head> и </head> страницы, на которой расположена ссылка.
Arwen - offline Arwen
07-07-2003 08:41 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

У меня в HEAD есть тег
<link rel="STYLESHEET" type="text/css" href="index.css">.
Все ссылки, которые расположены на странице меняют цвет, а те которые добавила я - нет. Когда убираешь эту строку, и добавляешь то, что вы посоветовали, это работает. Только с теми же ссылками. А мои добавленные так и не выделяются.
Может index.css надо править?
Anafay - offline Anafay
07-07-2003 09:15 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
А можно ли взглянуть на css? Очевидно, эти определения уже есть в index.css.
Arwen - offline Arwen
07-07-2003 09:50 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

td,p {color: #000000; font-size: 11px; font-family: Verdana, Tahoma, Arial, Geneva;}
a {color: #000000; font-size: 12px; text-decoration: none; font-weight: bold}
a:hover {color: #ff0000; text-decoration: none;}
.mn {color: #336699; font-size: 11px; font-family: Tahoma, Arial Cyr, Geneva; font-weight: bold; text-decoration: none;}
a.mn:hover {color: #ff0000; font-family: Tahoma, Arial Cyr, Geneva; text-decoration: none;}
.header {color: #ffffff; font-size: 11px; font-weight: bold;}
.text {color:#2D261F; font-size:10px; font-family:Verdana, Tahoma, Arial, Geneva; margin-top:5; margin-left:10; margin-right:18; vertical-align:top; text-align:justify;}

.menu {color:#2D261F; font-size:12px; font-family:Arial; margin-top:25; margin-left:10; margin-right:0; text-align:left; font-weight:bold;}
.small {color:#2D261F; font-size:10px; font-family:Courier; margin-top:5; margin-right:5; margin-left:5;}
.sl {color:#2D261F; font-size:12px; font-family:Courier; font-weight:bold;}
.body {color:#2D261F; font-size:14px; font-family:Verdana, Tahoma, Arial, Geneva; margin-top:45; margin-left:20; margin-right:20; font-weight:bold;}
.produce { color:#2D261F; font-size:7px; font-family:Arial; margin-right:15;}
.table {color:#002760; font-size:11px; font-family:Verdana, Tahoma, Arial, Geneva; margin-left:5; margin-right:30; font-size:11px; vertical-align:top; text-align:justify;}

H1 {color:#000000; font-size:10pt; font-family: Verdana, Tahoma, Arial, Geneva; text-align:left;}
LI {font-family: Verdana, Tahoma, Arial, Geneva; font-size
Anafay - offline Anafay
07-07-2003 09:57 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
Оно уже есть:
a {color: #000000; font-size: 12px; text-decoration: none; font-weight: bold}
a:hover {color: #ff0000; text-decoration: none;}

Убери из своего примера ссылки тэг FONT, и все поедет.
Arwen - offline Arwen
07-07-2003 09:59 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Нравица? ) Тут, насколько я поняла, уже заданы параметры тех ссылок, которые есть. А как правильно добавить новые, я только догадываюсь.
Может назвать это как-нить ss, поставить цвет, размер (мой любимый), а в
ss: hover указать как это будет выглядеть после наведения курсора.
Ну а затем в ХТМЛ перед ссылкой просто указать class="ss".
Да?
Anafay - offline Anafay
07-07-2003 10:08 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
a и a:hover - это ВСЕ ссылки в документе.

Если хочешь сделать что-то свое, отличное ото всех остальных ссылок, то заводишь класс:
.mylink
{
color:black;
}
.mylink a
{
color:black;
}
.mylink a:hover
{
color:red;
}

И пишешь: <p class="mylink"><a href="...">Text</a></p>
Arwen - offline Arwen
07-07-2003 10:08 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Не поняла.
<p><b><a href="http://www.lalala.ru/blank/music.html"><i>Музыка</i></a></b></p>
Это должно выглядеть вот так? А как же цвет?
Anafay - offline Anafay
07-07-2003 10:12 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
Цвет указан вот тут:
a {color: #000000....

Если цвет должен быть другим, отличным от остальных ссылок, заводи класс.
Arwen - offline Arwen
07-07-2003 10:12 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Это я про "убрать FONT".
Anafay - offline Anafay
07-07-2003 10:14 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
Тэг FONT препятствует установке цвета через css, - он же внутри ссылки. Поэтому его использовать нельзя.
Arwen - offline Arwen
07-07-2003 10:17 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Вот именно, что мои ссылки другого цвета. Думаю что придется заводить класс. В этом то и проблема. А шрифт и размер обязательно указывать? Или достаточно цвета?
Anafay - offline Anafay
07-07-2003 10:21 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Arwen
Бери пример с mylink и переделывай на свое усмотрение. Там только цвет.
Arwen - offline Arwen
07-07-2003 10:25 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

О, я счас сделала цвет ссылок одинаковый!
Ни фига не получилось, блин. Мои стали какие-то кривые и по прежднему не высвечиваются.
Arwen - offline Arwen
07-07-2003 10:36 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

А где это все можно прочитать?
Anafay - offline Anafay
07-07-2003 10:45 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать




Делай по сему:
<html>
<head>
<link rel="stylesheet" href="index.css">
<style type="text/css">
mylink
{
color:#ffff00;
}
.mylink a
{
color:#ffff00;
}
.mylink a:hover
{
color:red;
}
</style></head>
<body>
<a href="#">Это обычная ссылка</a>
<p class="mylink"><a href="#">Это твоя особая ссылка</a></p>
</body>
</html>

Сначала тут. А потом лучше первоисточник.
Dimitrius - offline Dimitrius
07-07-2003 11:05 URL сообщения      K-Mail    Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Пишу наиболее простой вариант

Допустим твоя страничка выглядит так:

<html>
<head>
<title>GalМоя страничка</title>
<meta http-equiv="Content-Type" content="text/html;">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>

<a href="http://www.kamrad.ru" target="_blank">Форум</a>
</body>
</html>

Создаешь новый стиль(в любом редакторе стилей, я пользуюсь Top Style pro 3.1), и прописываешь следующее

a:hover{
color: #000066;
}

Все. Сохраняешь его обзsваешь style.css(либо другим угодным тебе именем(токо не забудь его прописать ))

Запускаеш, все работает.

А вообще зайди на css.manual.ru, там правда ошибок довольно много, но что б понять что это такое и с чем его едят - в самый раз.
еще есть официальная спецификация....


__________________
Я не гений, я только учусь......

Arwen - offline Arwen
07-07-2003 11:09 URL сообщения        Профиль    Поиск    Контакт-лист   Редактировать
Камрад

Я счас вариант Anafey попробовала запустить. Не получилось. Сделала все, как написал. Попробуем другим способом. Если не получится, значит какая-то ошибка вышла. Ошибка ДНК.

Текущее время: 13:23 << < 1 2 > >>
новая тема  ответить следующая тема | предыдущая тема
 
Перейти:

версия для печати   отправить эту страницу по e-mail   подписаться на эту тему

 
Powered by: vBulletin Version 2.0.1
Copyright ©2000, 2001, Jelsoft Enterprises Limited.
Любое использование материалов сайта
возможно только с разрешения его администрации.

 

Рейтинг@Mail.ru
Рейтинг@Mail.ru