Контурная обводка текста

как сделано в Тильде

  • Создаем дизайн в Zero Block.
  • Нажимает на текстовый элемент правой кнопкой мыши, выбираем Add CSS class name.
  • Задаем название стиля, например, stroke.
  • Добавьте в Zero Block html-элемент.
  • Копируем код ниже и вставляем его в html-элемент, используя кнопку Edit Code.
<style>

.stroke {
     
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #fff;
    color: transparent !important; 
  
}

</style>
Параметр: -webkit-text-stroke-width: 2px; – отвечает за ширину линии обводки.
Параметр: -webkit-text-stroke-color: #fff; – отвечает за цвет линии обводки.

Если нужно, чтобы текст был прозрачным, только с обводкой – удалите значение цвета из параметра COLOR, в настройках текстового элемента в Zero блоке. Для заливки текста любым цветом, установите его значение в параметре COLOR, настроек текстового элемента в Zero блоке.

То, как работает контурная обводка текста, вы можете видеть в заголовке данной статьи.
Made on
Tilda