Свойство CSS text-stroke-color

Свойство text-stroke-color задаёт цвет обводки символа. Начальным значением свойства text-stroke-color является currentColor.

Вы можете выбрать цвета здесь HTML цвета.

INFO

Свойство text-stroke-color является стандартным свойством CSS, но в настоящее время требует префикса -webkit- для широкой поддержки браузерами. Firefox пока не поддерживает его.

Начальное значение	currentColor
Применяется к	Ко всем элементам.
Наследуется	Да.
Анимация	Да. Цвет можно анимировать.
Версия	CSS Text Module Level 4
Синтаксис DOM	object.style.textStrokeColor = "#8ebf42";

Синтаксис

Значения CSS text-stroke-color

css

text-stroke-color: color | initial | inherit;

Пример свойства text-stroke-color:

Пример кода CSS text-stroke-color

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      body {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1em;
        margin-top: 2em;
      }
      p {
        margin: 0;
        font-size: 3em;
        -webkit-text-stroke-width: 2px;
        text-stroke-width: 2px;
        -webkit-text-stroke-color: #8ebf42;
        text-stroke-color: #8ebf42;
      }
    </style>
  </head>
  <body>
    <h2>Text-stroke-color property example</h2>
    <p>Lorem Ipsum is simply dummy text...</p>
    <input type="color" value="#8ebf42" />
    <script>
      const input = document.querySelector('input[type="color"]');
      const p = document.querySelector('p');
      input.addEventListener('input', (e) => {
        p.style.webkitTextStrokeColor = e.target.value;
        p.style.textStrokeColor = e.target.value;
      });
    </script>
  </body>
</html>

Try it Yourself »

Результат

SS text-stroke-color values list

Значения

Значение	Описание
color	Задаёт цвет обводки. Можно использовать названия цветов, шестнадцатеричные коды, rgb(), rgba(), hsl(), hsla().
initial	Устанавливает для свойства значение по умолчанию.
inherit	Наследует значение свойства от родительского элемента.

Практика

Значением по умолчанию для text-stroke-color является значение по умолчанию для

свойства border-color.свойства color.свойства background-color.

Свойство CSS text-stroke-color ​

Синтаксис ​

Пример свойства text-stroke-color: ​

Результат ​