テンプレート:傍点/doc

CSSを使用して傍点（圏点）による強調表現を再現するテンプレートです。{{傍点|強調部分}}とマークアップすると、強調部分と出力されます。

使い方

最も簡単な使い方として、{{傍点|強調部分}}とマークアップすると強調部分と出力されます。デフォルトで黒ゴマ（﹅）傍点が文字上部に振られます。

傍点の形を指定する

style引数で傍点の形を指定できます。黒 (filled) か白抜き (open) かの指定の後に、スペースを挟み、ゴマ (sesame)、点 (dot)、丸 (circle)、二重丸 (double-circle)、三角 (triangle)のいずれかを指定します。

style引数で傍点の形を指定する例

マークアップ	出力結果
ここが{{傍点|style=open circle|強調部分}}です。	ここが強調部分です。

style引数で使用できるキーワード一覧

	黒 filled	白抜き open
ゴマ sesame	ここが強調部分です。	ここが強調部分です。
点 dot	こここが強調部分です。	ここが強調部分です。
丸 circle	ここが強調部分です。	ここが強調部分です。
蛇の目・二重丸 double-circle	ここが強調部分です。	ここが強調部分です。
三角 triangle	ここが強調部分です。	ここが強調部分です。

任意の文字を傍点に指定する

これらのキーワード以外にも、任意の一文字を傍点として使用することができます。傍点に使用したい文字をシングルクォートで囲んで指定します。この場合はfilledやcircleなどのキーワードは指定しません。

任意の一文字を傍点として使用する例

マークアップ	出力結果
ここが{{傍点|style='✗'|強調部分}}です。	ここが強調部分です。

互換性

2017年現在、Chrome、Firefox、Safari、Operaの各ブラウザが傍点表示に対応しています。Internet Explorer及びEdgeは未対応です。各ブラウザの詳細な対応状況はCaniuse.comを参照してください。

傍点がもつ強調というセマンティクスを表現するため、また傍点に対応していないブラウザやCSSオフ状態で表示したときに強調部分を区別するため、このテンプレートで出力される文字部分はemタグで囲み、さらに太字で表示されるようになっています。

その他

• {{dot}}でも代用できます。

関連項目

• テンプレート:二重線 - 傍線

外部リンク

• CSS Text Decoration Module Level 3 - W3C CSSWGによる text-emphasis-style の仕様書
• text-emphasis-style - CSS | MDN - Mozillaによる text-emphasis-style の技術文書
• Can I use... Support tables for HTML5, CSS3, etc - text-emphasis-style のブラウザバージョンごとの対応状況