【CSS Modules】font-variant-ligaturesプロパティの使い方

font-variant-ligaturesプロパティは、テキスト表示における「リガチャ」（合字）の有効・無効を制御する設定値を保持するプロパティです。リガチャとは、特定の文字の組み合わせ、例えば「fi」や「fl」などが隣接する際に、それらを単一の結合された文字として美しく表示するためのタイポグラフィの機能です。このプロパティを使用することで、テキストの視覚的な品質や読みやすさを向上させることができます。

このプロパティにはいくつかの値があり、それぞれ異なる種類のリガチャに影響を与えます。normalを指定すると、フォントが提供する標準的なリガチャ（一般的なリガチャ、文脈依存のリガチャなど）が有効になります。noneを指定すると、全てのリガチャが無効になり、文字は個別に表示されます。

より詳細な制御が必要な場合は、 specificな値を設定します。例えば、common-ligaturesは「ff」「fi」「fl」といった広く使われるリガチャを有効にし、no-common-ligaturesでそれらを無効にします。discretionary-ligaturesは、デザイン上の選択肢として提供される任意の合字を有効にし、no-discretionary-ligaturesで無効にします。また、historical-ligaturesは過去の書体に見られる合字を有効にし、no-historical-ligaturesで無効にすることができます。contextualは、文字の並びの文脈に応じて形が変化するリガチャを有効にし、no-contextualで無効にします。

これらの値を適切に設定することで、ウェブサイトやアプリケーションにおけるテキストの組版を高度に調整し、視覚的な表現力を高めることが可能です。ただし、指定したリガチャが実際に適用されるかどうかは、使用しているフォントがそのリガチャの情報を含んでいるか、およびウェブブラウザがそれをサポートしているかに依存します。

Copy
1p {
2  font-variant-ligatures: none;
3}

引数なし

引数はありません

戻り値なし

戻り値はありません