Приветствую!
Хотелось бы иметь возможность 1 решения для всех случаев подчеркивания текста (сложного картинкой или градиентом, с переносом строк и анимацией при наведение). На данный момент я использую 3 решения (как сократить?):
1. Если нужно подчеркивание каждой строки, с переносе текста и анимацией при наведение:
text-decoration: underline;
text-decoration-style: solid;
text-decoration-color: red;
text-decoration-skip-ink: none;
text-underline-offset: X;
text-decoration-thickness: X;
Проблемы:
- Отсутствует возможность сложного подчеркивания изображением или градиентом.
2. Если нужно сложное подчеркивание изображением или градиентом:
Через
background-image, пример:
https://codepen.io/cassie-codes/pen/rNNGdmw
Проблемы:
- Отсутствует возможность анимации у
background-image.
3. Если нужно сложное подчеркивание изображением или градиентом, с анимацией:
Через псевдо-элементы, пример:
https://codepen.io/iam_aspencer/pen/qvNPBv
Проблемы:
- Отсутствует возможность переноса подчеркивания с переносом текста ну другие строки.
