クリエイター:コーディング備忘録ブログ

コーディング

font-feature-settingsで文字詰め

CSSのプロパティのfont-feature-settingsで自動カーニングをすることが可能です。

ですが、すべてのフォントで自動カーニングしてくれるわけではありません

利用できるフォントは、

1,OpenTypeフォント
2,プロポーショナルメトリクス情報がフォントに含まれている

上記の条件を満たすフォントは

ヒラギノ角ゴシックヒラギノ明朝、游ゴシック、游明朝

webフォントではNoto Sans CJK JPなどです。

文章などに基本的に使用するメイリオにはプロポーショナルメトリクスの情報は含まれていません。

ですのでfont-feature-settingsでは自動カーニングが残念ながらできません。

EdgeやIE11では

text-align:justify
text-justify:inter-ideograph
font-feature-setting : “palt”

上記をあわせて使用した場合、両端揃えができないなどの不具合がありますが、

プロパティ自体の対応状況は、大体のモダンブラウザで使用できます。
Notoフォントなど和文フォントを使用する際などに利用してみると、きれいに読みやすくなるサイトになるかと思います。

コメント

この記事へのコメントはありません。

RELATED

PAGE TOP