Как с помощью html и css можно изменить цвет ссылки и убрать подчеркивание

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

Как изменить цвет ссылки с помощью HTML.

Как вы помните, ссылка вставляется следующим образом:

<a href="URL адрес страницы">Анкор</a>

По умолчанию ссылка синего цвета с подчеркиванием. Попробуем c помощью html изменить цвет ссылки. Для этого добавляем в код следующий текст:

<a href="URL адрес страницы" style="color:#FF0000;">Изменяем цвет ссылки</a>

Как видим, ссылка поменяла свой цвет. Какой цвет теперь будет у ссылки, зависит от #FF0000. Это специальный цветовой код html, который присваивается каждому цвету всей цветовой палитры. Для того, чтобы определить какой код имеет тот или иной цвет ,советую прочитать статью палитра цвета html.

Как убрать подчеркивание.

Для того, чтобы убрать подчеркивание, необходимо в кодировку html ссылки добавить:

<a href="URL адрес страницы" style="color:#FF0000; text-decoration:none">Убираем подчеркивание</a>

Как видите, подчеркивание исчезло.

Как изменить цвет ссылки с помощью CSS.

Вышеописанный метод, несмотря на всю свою простоту, используется крайне редко. Как правило, для оформления веб-страницы используется таблица ститей style.css в которой прописывается оформление всех элементов страницы, в том числе, и ссылок.

Для того, чтобы изменить цвет всех ссылок в тексте, а также убрать подчеркивания достаточно прописать в файле css следующий код:

 a { color:#537CBC; text-decoration:none;}

Ну вот и все. Не забывайте оценивать статью и ставить лайки. Ну и, разумеется, комментируйте.

Похожие записи

12 комментариев

  1. Ни че так статья. Доходчиво. А по PHP уроки публиковать планируете?

  2. В css цвет задала другой, но по факту ссылки все равно отображаются синие. Не понимаю, где еще менять?

  3. Нигде больше ничего менять не надо. Если ссылки не поменяли свой цвет, значит вы что-то не так поменяли в css


  4. Оксана:

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

    Установите На Мозиллу firebug это приложение по полочкам css разбирает и укажет вам в какой строке и какой параметр менять.

  5. Добрый день!
    пробовал сделать, как вы описали не получается.
    в моем шаблоне очень блеклые серые ссылки. Пробовал скопировать ваш тестовый код, но ничего не изменилось. Можете помочь?

  6. Чтобы при наведении менялся цвет нужно добавить в css код следующую строку a:hover {color: #800000;} где #800000 — код цвета, которым должна окраситься ссылка при наведении

  7. Что-то так не получается ничего. А точно все двоеточия нужно ставить? (a:hover {color: #800000;}) Я про это….

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *