@aidarDev

Как сделать такой эффект обводки у текста?

Всем привет!

Как сделать такой эффект на css? - 5f4670d6d8897547615875.png
Пытался через text shadow, но не получается( помогите плиз

UPD:
подсказали про -webkit-text-stroke, почти что нужно, но не получается скруглить эту -webkit-text-stroke как на скрине

  • Вопрос задан
  • 138 просмотров
Решения вопроса 1
sniggering_deus
@sniggering_deus Куратор тега CSS
Dance Gavin Dance - Prisoner
Как вариант можете поиграть с этим свойством: -webkit-text-stroke, но поддержка у него кажется слабая. В любом случае есть свойство для проверки поддержки того или иного свойства: @supports

Ещё как вариант можно попытаться с псевдоэлементом это сделать. То есть в content: "" псевдоэлемента дублировать текст из родительского блока, увеличивать размер шрифта, и применить эти свойства:

-webkit-background-clip: text;
-webkit-text-fill-color: transparent;


Это даст возможность установить подходящий фон для заливки текста, а далее через background можно будет например задать градиентный фон или что-то другое.

Или использовать SVG.
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@agafonov_sv
Теги h1,...,h6 относятся к блочным элементам, вы border присваиваете не к тексту а к элементу H1. Предлагаю воспользоваться онлайн генератором owumaro.github.io/text-stroke-generator
Ответ написан
RAX7
@RAX7
SVG фильтрами можно попробовать сделать
https://tympanus.net/codrops/2019/01/22/svg-filter...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы