Как изменить цвет ссылки в HTML и CSS коде вашего блога или сайта не важно на каком движке    


Мандарин
Главная » 2016 » Декабрь » 23 » Как изменить цвет ссылки в HTML и CSS коде вашего блога или сайта не важно на каком движке » [447]
12:27
Как изменить цвет ссылки в HTML и CSS коде вашего блога или сайта не важно на каком движке

Работа с кодом HTML и CSS всё это, будет работать на любом движке, неважно будь это WordPress или uCoz, ведь HTML и CSS используется во всех движках.

Доброго времени суток! Устраивает ли вас цвет ссылок друзья на вашем блоге или сайте? Если нет, и вы хотите изменить цвет ссылки, не беда. Сегодня я научу вас, как изменить цвет ссылки в HTML и CSS коде.

Работа с кодом HTML и CSS всё это, будет работать на любом движке, неважно будь это WordPress или uCoz, ведь HTML и CSS используется во всех движках. И так идём учится.

Цвет ссылки в CSS

Обычно все ссылки в шаблоне вашего сайта имеют одинаковый цвет, чаще это голубой или синий цвет. Отличаются только ссылки заголовков и подзаголовков.

Значение, каким цветом выводить ссылки на сайте прописывается в CSS коде, чаще всего в файле style.css. Находится этот файл всегда в корневой папке сайта.

Чтобы изменить цвет всех ссылок на сайте в CSS вам нужно открыть файл style.css и найти в нем код отвечающий за вывод ссылок. Просто найдите упоминание link или Link Styles.

стиль ссылок

Этот самый CSS код и отвечает за цвет всех ссылок сайта. А если рассмотреть детально, то в данном коде могут быть следующие значения:

Цвет CSS ссылок в обычном состоянии.

a:link { 
color: #0169D3; /* Цвет ссылок */
 }

CSS цвет ссылок при нажатии на нее.

a:active{ 
color: #0169D3; /* Цвет активной ссылки */
 }

Цвет посещенной ссылки.

a:visited{ 
color: #0169D3; /* Цвет посещенной ссылки */
 }

Соответственно, чтобы цвет ссылок в спокойном состоянии, мы меняем значение color: #0169D3 на свой цвет в псевдоклассе a:link.

Чтобы изменить цвет посещенных ссылок, нужно изменить значение color: #0169D3 в псевдоклассе a:visited.

Если вы хотите, чтобы ваши ссылки стали подчеркнутыми, нужно вписать в CSS код ссылки значение text-decoration:underline; как на примере:

a:link { 
 text-decoration:underline;
 color: #0169D3; 
 }

А если наоборот хотите убрать подчеркивание ссылки, нужно вписать значение text-decoration:none;

a:link { text-decoration:none;
 color: #0169D3; 
 }

Как менять цвет ссылок в CSS думаю понятно. Теперь давайте рассмотрим как изменить цвет ссылки в HTML коде.

HTML цвет ссылки

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

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

<a href="http//:sait.ru">анкор ссылки</a>

Для того, чтобы задать ей цвет, нужно добавить значение font color для текста ссылки, чтобы получилось вот так:

<a href="http//:sait.ru"><span style="color: #f61212;">анкор ссылки</span></a>

Таким образом я выделил ссылку красным цветом в HTML коде.

Как видите все довольно просто. В статье я рассказал лишь основы о стиле выделения ссылок в коде. Но благодаря CSS можно создать свой уникальный стиль выделения ссылок, например сделать всплывающие подсказки, вставить тень, сделать ссылку мигающей. Но об этом я постараюсь рассказать уже в другой статье.

Да к стати о мигающих всеми цветами радуги ссылках, если вы на моём сайте то наверно заметили что некоторые ссылки переливаются. Вот этот код для установки на сайт, просто вставьте код в шапку (header) вашего сайта.

Код:

<script language="JavaScript" type="text/javascript" src="http://miru-news.ru/js/raduga.js"></script>

Свои фото, видеоматериалы, новости присылайте на электронный адрес: yarickiy@miru-news.ru

 

 

Источник

Новости России и в мире, Политика, Веб-Мастер


Категория: Веб-Мастер | Просмотров: 447 | :: : | Теги: HTML код, Как изменить цвет ссылки, HTML и CSS
Всего комментариев: 0
avatar