【CSS Modules】font-feature-settingsアットルール記述子の使い方

font-feature-settingsプロパティは、@font-faceルール内で使用されるディスクリプタとして、フォントが持つOpenType機能の設定を保持するプロパティです。これは、特定のWebフォントがブラウザでレンダリングされる際に、そのフォントに組み込まれた高度なタイポグラフィ機能を有効にしたり、無効にしたりするために利用されます。

通常、フォントには合字（ligatures）や数字のスタイル（例えば、オールドスタイル数字や等幅数字）、スモールキャップ、分数表示など、様々なOpenType機能が内蔵されています。このfont-feature-settingsディスクリプタを使用することで、これらの機能を細かく制御することが可能になります。例えば、標準的な合字を有効にするには特定のタグを指定し、オールドスタイル数字を使いたい場合にも対応するタグと値を設定します。

具体的な値としては、機能を無効にするnormalや、全ての機能をオフにするoff、または4文字のOpenType機能タグとその設定値を指定する方法があります。例えば、標準合字を有効にするには"liga"、選択的な合字を有効にするには"dlig"のように指定します。このプロパティは、font-variant関連のCSSプロパティでは制御できない、より低レベルなOpenType機能を直接操作したい場合に特に有用です。

ただし、font-feature-settingsは比較的低レベルな制御を提供するため、通常はfont-variant-ligaturesやfont-variant-numericなどのより高レベルなCSSプロパティを使用することが推奨されます。これらの高レベルなプロパティが提供する機能で十分な場合はそちらを優先し、それらでは対応できない特殊なOpenType機能のみをfont-feature-settingsで指定するのが一般的です。ブラウザの対応状況やパフォーマンスへの影響も考慮しながら、慎重に使用することが重要です。

Copy
1font-feature-settings: "liga" 1, "dlig" 0;

引数なし

引数はありません

戻り値なし

戻り値はありません