text-emphasisプロパティ

値

このプロパティはtext-emphasis-styleプロパティとtext-emphasis-colorプロパティをまとめて指定することができます。
印の表示位置を指定するtext-emphasis-colorプロパティは指定できないため、個別に指定する必要があります。

CSSコード例

p span {
	text-emphasis: triangle blue;
	-webkit-text-emphasis: triangle blue;
}

使用例

印のスタイル、色、表示位置を指定

text-emphasisプロパティとtext-emphasis-positionプロパティを使って、印のスタイル、色、表示位置を指定します。
2018年12月現在、ChromeとOperaでこのプロパティを使用するにはベンダープレフィックス「-webkit-」を付けて指定する必要があります。

HTMLコード例

<p class="sample2">印の<span>スタイルと色</span>をまとめて指定する</p>

CSSコード例

.sample2 span {
	text-emphasis: circle #ccc;
	-webkit-text-emphasis: circle #ccc;
	text-emphasis-position: under left;
	-webkit-text-emphasis-position: under left;
}

印のスタイルと色はtext-emphasisプロパティで指定し、表示位置についてはtext-emphasis-positionプロパティから指定しています。

こちらの記事は役に立ちましたか？

コメントありがとうございます！
運営の参考にさせていただきます。