Как сделать красивую ссылку?
Ссылки значительно влияют на внешний вид web-страницы. Будь то ваш сайт или блог, красиво настроенные ссылки изменят дизайн сайта в лучшую сторону. Даже без знаний html и css сделать красивую ссылку довольно просто. Создать сайт самостоятельно с Wix.comВ первую очередь, давайте создадим обычную ссылку. Делается это с помощью такого кода: название ссылки. В этом коде тэг ссылки. Его атрибут «href» указывает адрес страницы, на которую ведет ссылка. Вместо «название ссылки» напишите слово или словосочетание, которое и будет представлять из себя ссылку.
Теперь займемся оформлением ссылок. Проще всего это делать в каскадных таблицах стилей (css). Откройте файл, содержащий стили вашего сайта и пишите дальнейший код там. Или же вы можете вставить стили прямо на html-страницу. Для этого используйте код настройки стиля сайта. Приступим к оформлению. Синтаксис записи будет такой: a{параметры стиля}. Что же сюда писать?
По умолчанию браузер делает ссылки подчеркнутыми. Отменить это можно таким кодом: a{text-decoration:none;}Для создания ссылок «жирным» шрифтом, используйте параметр font-weight:bold;. Он вставляется в код стилей по тому же принципу, что и цвет, подчеркивание. Вы наверняка замечали, что на некоторых сайтах при наведении на ссылку ее вид изменяется. Вы тоже можете сделать это. Вам поможет код такого вида: a:hover {параметры стиля}. Параметры указываются точно так же, как для обычной ссылки, единственное значение – псевдокласс «hover», оповещающий браузер, что данные настройки следует применять при наводе на ссылку.По такому же принципу вы можете выделить и посещенные ссылки: a:visited {параметры стиля}
Оцените статью!
Инструкция
Также вы можете добавить текст, который будет появляться при наводе на ссылку. В этом вам поможет атрибут «title» тэга .
Для начала измените цвет ссылок на свой вкус. В этом вам поможет такой код:
a{color: #00000;}. Разумеется, вместо «#00000» вы должны вставить свой цвет. Узнать код цвета в подобном виде можно в разных графических программах (например, в фотошоп) или найти web-палитру.