Красивые ссылки в Тильде, часть 2
Тильда — любимый мною конструктор сайтов. Всем она хороша, кроме стиля ссылок по-умолчанию: они не подчеркнуты. Поправим это в три простых шага, а бонусом сделаем плавную смену цвета.
(Зачем вообще подчеркивать ссылки? Мнение Лебедева, дискуссия у Бирмана)
1. Задаем цвет текста ссылки
Например, #2599e6. Для этого создадим блок Т193 «Модификатор: стиль ссылок» из раздела блоков «Другое», зайдем в настройки блока и вставим нужный цвет в поле «Цвет текста».
Чтобы блок работал для всего сайта, создайте его на специальной странице «Шапка сайта».
2. Задаем цвет подчеркивания
Например, #b5e1ff. В том же блоке ставим нужный цвет в поле «Цвет линии».
В идеальном мире линия того же цвета, что и ссылка, но полупрозрачная. В Тильде прозрачность линии не поменять, но эффект можно имитировать более светлым тоном и минимальной толщиной (1px в поле «Размер линии»).
3. Задаем цвет текста при наведении
Например, #ba0095. Заходим в «Настройки сайта», переходим в нижний раздел «Еще», нажимаем «Редактировать CSS». Вставляем код и сохраняем:
a, a:visited {
-webkit-transition: 0.5s ease;
transition: 0.5s ease;
}
a:hover, a:visited:hover {
color: #ba0095 !important;
-webkit-transition: 0s ease;
transition: 0s ease;
}
Переменные webkit-transition и transition обеспечат красивое затухание цвета при проносе курсора. Если не нужно, удалите эти строки.
Результат с цветами из примеров смотрите на моем сайте: