文字の書体(フォント)を設定

SVGで文字の書体(フォント)を設定するには、font-family属性を使用します。
CSSと同様にカンマ区切りで指定してフォントがない場合の代替フォントを指定していくことができます。
省略した場合はCSS上の継承された書体が反映されます。

構文

font-family="書式名"

サンプルコードとデモ

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

XML

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 90" width="200" height="90">
	<text y="14">あいうえお</text>
	<text y="34" font-family="sans-serif">あいうえお</text>
	<text y="54" font-family="serif">あいうえお</text>
	<text y="74" font-family="メイリオ,MS Pゴシック,sans-serif">あいうえお</text>
</svg>

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