このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。
-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 2017年4月.
-webkit-text-stroke-width はCSS のプロパティで、テキストの線の太さを指定します。
構文
css
/* キーワード値 */-webkit-text-stroke-width: thin;-webkit-text-stroke-width: medium;-webkit-text-stroke-width: thick;/* <length> 値 */-webkit-text-stroke-width: 2px;-webkit-text-stroke-width: 0.1em;-webkit-text-stroke-width: 1mm;-webkit-text-stroke-width: 5pt;/* グローバル値 */-webkit-text-stroke-width: inherit;-webkit-text-stroke-width: initial;-webkit-text-stroke-width: unset;値
<line-width>線の太さ。
公式定義
| 初期値 | 0 |
|---|---|
| 適用対象 | すべての要素 |
| 継承 | あり |
| 計算値 | 絶対的な長さ |
| アニメーションの種類 | 離散値 |
形式文法
-webkit-text-stroke-width =
<line-width>
<line-width> =
<length [0,∞]>|
thin|
medium|
thick
例
線の幅を変更
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>Thin stroke</p><p>Medium stroke</p><p>Thick stroke</p>結果
仕様書
| Specification |
|---|
| Compatibility # the-webkit-text-stroke-width |