-webkit-text-stroke-width

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017.

Die -webkit-text-stroke-width- CSS-Eigenschaft legt die Breite des Umrisses für Text fest.

Syntax

css
/* Keyword values */
-webkit-text-stroke-width: thin;
-webkit-text-stroke-width: medium;
-webkit-text-stroke-width: thick;

/* <length> values */
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-width: 0.1em;
-webkit-text-stroke-width: 1mm;
-webkit-text-stroke-width: 5pt;

/* Global values */
-webkit-text-stroke-width: inherit;
-webkit-text-stroke-width: initial;
-webkit-text-stroke-width: revert;
-webkit-text-stroke-width: revert-layer;
-webkit-text-stroke-width: unset;

Werte

<line-width>

Die Breite des Umrisses.

Formale Definition

Anfangswert0
Anwendbar aufalle Elemente
VererbtJa
Berechneter Wertabsolute <length>
Animationstypdiskret

Formaler Syntax

-webkit-text-stroke-width = 
<line-width>

<line-width> =
<length [0,∞]> |
thin |
medium |
thick

Beispiele

Unterschiedliche Umrissbreiten

CSS

css
p {
  margin: 0;
  font-size: 4em;
  -webkit-text-stroke-color: red;
}

#thin {
  -webkit-text-stroke-width: thin;
}

#medium {
  -webkit-text-stroke-width: 3px;
}

#thick {
  -webkit-text-stroke-width: 1.5mm;
}

HTML

html
<p id="thin">Thin stroke</p>
<p id="medium">Medium stroke</p>
<p id="thick">Thick stroke</p>

Ergebnisse

Spezifikationen

Specification
Compatibility
# the-webkit-text-stroke-width

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
-webkit-text-stroke-width

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch