Создание сайта
Регистрация
Продвижение
Монетизация
Облако тегов

Требуется для просмотраFlash Player 9 или выше.

Показать все теги

Главная » Создание сайта » HTML » Как изменить цвет ссылки HTML

Как изменить цвет ссылки HTML
Раздел: Создание сайта » HTML  
25 сентября 2009   |   автор: admin Оставить комментарий



Как изменить цвет ссылки HTML

 

 

Ссылка в HTML выглядит следующим образом:

 

<a href="/" title="Ссылка HTML">Изменяем цвет ссылки</a>

 

По умолчанию ее цвет синий и она будет иметь подчеркивание.

 

 

Вы можете изменить ее цвет и убрать подчеркивание, просто добавив внутрь тега свойство style с соответствующими значениями. Вот так:

 

<a href="/" title="Ссылка HTML" style="color:#FF0000; text-decoration:none">Изменяем цвет ссылки</a>

 

 

Есть и другой способ изменить внешний вид ссылки. Для этих целей используются таблицы стилей CSS. Причем вы сможете задать значения для ссылок при различных условиях, будь-то активная ссылка (a:active), посещенная ссылка(a:visited) либо ссылка при наведении мыши (a:hover). Вот как это делается:

 

 

a {
color:#FF0000;
text-decoration:none
}

a:active {
color:#FF0000;
text-decoration:none
}

a:visited {
color:#666666;
text-decoration:none
}

a:hover {
color:#339900;
text-decoration: underline
}

 

 

 

Создайте два файла.

 

Первый index.html с таким содержимым:

 

<html>

<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>

 

<a href="/" title="Ссылка HTML">Изменяем цвет ссылки</a>


</body>

</html>

 

 


А второй назовите style.css. В нем запишите следующее:

 

 

a {
color:#FF0000;
text-decoration:none
}

a:active {
color:#FF0000;
text-decoration:none
}

a:visited {
color:#666666;
text-decoration:none
}

a:hover {
color:#339900;
text-decoration: underline
}

 

 

 

Изменяя значения свойств можно менять внешний вид ссылок.



Ключевые теги: ссылка html, html
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
web-lesson.ru
Добавление комментария
Ваше Имя:
Ваш E-Mail:
Код:
Введите код