Инструкция
1
Для редактирования параметра отображения ссылки необходимо изменить код страницы. Откройте ваш HTML-документ при помощи утилиты для редактирования кода. Воспользуйтесь стандартным редактором Windows «Блокнот». Вы также можете установить дополнительно такие программы, как Notepad++ или HTML-Viewer которые позволят просмотреть нужный вам код с подсветкой синтаксиса. Для открытия файла в редакторе кликните правой клавишей мыши и выберите «Открыть с помощью». В появившемся списке укажите выбранную вами утилиту.
2
В окне редактора перейдите к ссылке, цвет которой вы хотите изменить. Каждая ссылка имеет вид <a href = “адрес_ссылки”>Имя ссылки</a>. Чтобы изменить цвет текста, используется параметр style.
3
Выбрав нужную для изменения строчку, перейдите в блок <head></head> страницы. После закрывающего дескриптора </title> введите тег <style> и создайте нужный псевдокласс CSS. Например:
<style>
.colorchange { color: red;
background: blue;
padding: 1px; }
</style>
<style>
.colorchange { color: red;
background: blue;
padding: 1px; }
</style>
4
Данный код создает псевдокласс с именем colorchange, который может быть использован в атрибутах ссылок. Параметр color отвечает за цвет текста элемента – в данном случае стоит значение red, которое и создаст текст красного цвета. Вы можете внести любое значение HTML в данный пункт. Цвет фона ссылки задается через параметр background. Параметр padding отвечает за отступ ссылки относительно других элементов.
5
После создания псевдокласса его нужно задать в самом теле документа. Вернитесь на тот участок кода, где расположена ваша ссылка. Отредактируйте ее, вписав параметр class и задав ему значение с именем псевдокласса CSS. Например:
<a href = “адрес_ссылки” class = “colorchange”>Название ссылки</a>
<a href = “адрес_ссылки” class = “colorchange”>Название ссылки</a>
6
Вы создадите ссылку красного цвета с синим фоном и отступом в 1 пиксель, как и было задано в коде CSS выше. Сохраните произведенные в файле изменения и закройте окно редактора. Для проверки указанного кода откройте вашу страницу в окне браузера, чтобы убедиться, что произведенные настройки сделаны правильно. Выделение ссылки цветом завершено.
Источники:
- Таблица цветов HTML в 2019
- Notepad++ в 2019