文字へ線を設定

SVGで文字へ線を設定するには、text-decoration属性を使用します。

構文

text-decoration="種類"

指定可能な値は次の通りです。

属性値 説明
underline 下線
overline 上線
strike-through 取り消し線

サンプルコードとデモ

あいうえお あいうえお あいうえお あいうえお

XML

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 150" width="200" height="150">
	<text y="14">あいうえお</text>
	<text y="34" text-decoration="underline">あいうえお</text>
	<text y="54" text-decoration="overline">あいうえお</text>
	<text y="74" text-decoration="strike-through">あいうえお</text>
</svg>

SVG逆引きリファレンス一覧へ戻る