Плавное подчеркивание ссылки

В моем случае это плавное подчеркивание слева направо. Отключаем стандартное подчеркивание. Создаем псевдоэлемент — линию в 1px и задаем ширину 0. При наведении ширина становится 100%.

Как наложить градиент на картинку с помощью css

Подсмотрела следующее решение: Мой код, где blog-card__image — внешний блок с картинкой внутри. blog-card__date — блок вывода даты, которая лежит поверх картинки внизу и должна быть видна на любом изображении, для этого и нужен градиент с прозрачного на черный, переходящий вниз. Код css:

Как сделать текст градиентом

Мне надо было на сайте сделать градиентным только заголовок 1 уровня h1. К h1 применила дополнительно следующие стили: Здесь background-color нужен чисто для подстраховки, на случай, если градиент не сработает. К свойству background применен сам градиент. Свойство CSS background-clip: text; указывает, что цвет фона или фоновое изображение будут выводиться внутри текста. Также добавлю, что препроцессор… Читать далее Как сделать текст градиентом