最終更新日 2021年6月3日

text-emphasisプロパティ

text-emphasisは、text-emphasis-styleとtext-emphasis-colorを、まとめて指定するためのショートハンドプロパティです。

それぞれの値は、半角スペースで区切って好きな順番で並べます。

なお、強調マークの位置を指定する場合は、text-emphasis-positionを使用します。

CSS3での変更点

・text-emphasisは、CSS3から新しく追加されたプロパティです。

初期値	適用先	継承
各プロパティの初期値	すべての要素	あり

値	説明
text-emphasis-styleの値	強調マークの種類を指定します。
text-emphasis-colorの値	強調マークの色を指定します。

サンプルコード

text-emphasis: filled dot #f00;
text-emphasis: filled circle #f00;
text-emphasis: filled double-circle #f00;
text-emphasis: filled triangle #f00;
text-emphasis: filled sesame #f00;
text-emphasis: open dot #f00;
text-emphasis: open circle #f00;
text-emphasis: open double-circle #f00;
text-emphasis: open triangle #f00;
text-emphasis: open sesame #f00;
text-emphasis: "★" #f00;

参考文献：CSS Text Level 3

当サイトの活動をサポートしてみませんか？気軽にクリエイターの支援ができます。