# Свойство text-stroke-width

Свойство `text-stroke-width` задает толщину контура символов текста или его обводки. Свойство принимает значения, указанные в единицах размеров в `px`, `em`, `rem` и т.п. Также можно задать следующие значения: `thin` (тонкая линия), `medium` (средняя линия) и `thick` (толстая линия).

## Синтаксис

`селектор { text-stroke-width: число или thin или medium или thick; }`

## Пример

Давайте зададим символам нашего текста тонкую обводку:

`<p> Text </p>` `body { width: 100px; height: 50px; } p { -webkit-text-stroke-color: orange; -webkit-text-stroke-width: thin; text-stroke-width: thin; color: white; font-size: 10em; margin-top: 0; font-weight: bold; font-family: Arial; }`

:

## Пример

А теперь давайте поменяем тонкую обводку на среднюю:

`<p> Text </p>` `body { width: 100px; height: 50px; } p { -webkit-text-stroke-color: orange; -webkit-text-stroke-width: medium; text-stroke-width: medium; color: white; font-size: 10em; margin-top: 0; font-weight: bold; font-family: Arial; }`

:

## Пример

Давайте зададим символам нашего текста толстую обводку:

`<p> Text </p>` `body { width: 100px; height: 50px; } p { -webkit-text-stroke-color: orange; -webkit-text-stroke-width: thick; text-stroke-width: thick; color: white; font-size: 10em; margin-top: 0; font-weight: bold; font-family: Arial; }`

:

## Пример

Также давайте зададим символам нашего текста обводку в `2px`:

`<p> Text </p>` `body { width: 100px; height: 50px; } p { -webkit-text-stroke-color: orange; -webkit-text-stroke-width: 2px; color: white; font-size: 10em; margin-top: 0; font-weight: bold; font-family: Arial; }`

:

## Смотрите также

- свойство `text-stroke`,
  которое задает обводку текста
- свойство `text-stroke-color`,
  которое задает цвет обводке текста

← →
↑
en ru