[go: up one dir, main page]

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

-webkit-text-stroke-color

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-color は CSS のプロパティで、テキストの文字の線のを示します。このプロパティが設定されない場合、 color プロパティの値が使用されます。

構文

css
/* <color> 値 */
-webkit-text-stroke-color: red;
-webkit-text-stroke-color: #e08ab4;
-webkit-text-stroke-color: rgb(200, 100, 0);

/* グローバル値 */
-webkit-text-stroke-color: inherit;
-webkit-text-stroke-color: initial;
-webkit-text-stroke-color: unset;

<color>

線の色。

公式定義

初期値currentcolor
適用対象すべての要素
継承あり
計算値色の計算値
アニメーションの種類 データ型の値は、赤、緑、青のそれぞれの値ごとに、浮動小数点の実数として扱われて補間されます。なお、アルファ事前混合 sRGBA 色空間で色の補間を行うと、予期せずに灰色が現れることがあります。">色

形式文法

-webkit-text-stroke-color = 
<color>
この構文は Compatibility による最新の標準を反映しています。すべてのブラウザーがすべての部分を実装しているわけではありません。サポート情報についてはブラウザーの互換性を参照してください。

角の色を変化させる

HTML

html
<p>Text with stroke</p>
<input type="color" value="#ff0000" />

CSS

css
p {
  margin: 0;
  font-size: 4em;
  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #ff0000; /* ライブサンプルで変更可能 */
}

結果

仕様書

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

ブラウザーの互換性

関連情報