font-variant-alternates CSS3

font-variant-alternates は、代替文字の選択を管理します。フォントは任意の文字に対して その文字のデフォルトグリフ（字形）に加えて様々な代替グリフを提供することができます。

名前:font-variant-alternates
値: 
normal |
[  historical-forms 
|| stylistic(<feature-value-name>) 
|| styleset(<feature-value-name> #) 
|| character-variant(<feature-value-name> #) 
|| swash(<feature-value-name>) 
|| ornaments(<feature-value-name>) 
|| annotation(<feature-value-name>) ]
初期値:normal
適用対象:全ての要素
継承:する
パーセンテージ:n/a
メディア:visual（視覚的）
計算値:as specified（指定通り）
アニメーション:できない

Value（値）

normal
初期値 通常
historical-forms
歴史的な（過去に一般的だった）形状の表示を有効にする。（OpenType機能: hist）
stylistic(<feature-value-name>)
スタイル代替の表示を有効にする。（OpenType機能: salt <feature-index>）
styleset(<feature-value-name> #)
スタイルセットでの表示を有効にする。（OpenType機能: ss <feature-index> 現在 ss01～ss20を定義）
character-variant(<feature-value-name> #)
特定の文字の異形（変形）を有効にする。（OpenType機能：cv <feature-index> 現在cv01～cv99を定義）
swash(<feature-value-name>)
swash（飾り書き）グリフの表示を有効にする。（OpenType機能：swsh <feature-index>、cswh <feature-index>）
ornaments(<feature-value-name>)
フォントで指定されている場合、デフォルトのグリフを装飾で置き換える。（OpenType機能：ornm <feature-index>）
annotation(<feature-value-name>)
注釈（annotation）の形状の表示を有効にする。丸文字など。（OpenType機能：nalt <feature-index>）

font-variant-alternates プロパティ値の多くは、いくつかの異なる代替グリフが利用できます。 利用できる代替グリフの個数や表現はフォントに依存します。 @font-feature-values 規則を使い、フォント固有の数値 <feature-index> と カスタム特徴値名 <feature-value-name> を関連付けて、特定のフォントファミリまたはファミリセットの値を定義します。 そして、font-variant-alternates プロパティでカスタム特徴値名を指定して代替グリフを選定します。 

@font-feature-values Noble Script { @swash { swishy: 1; flowing: 2; } }

p {
  font-family: Noble Script;
  font-variant-alternates: swash(flowing); /* swashの2番目の代替を利用 */
}
上に戻る