@font-feature-values
は CSS のアット規則で、OpenType で有効化された特性が異なるものに対して font-variant-alternates
プロパティで共通の名前を使用することができます。これは、複数のフォントを使用している場合に CSS を簡素化するのに役立ちます。
@font-feature-values
アット規則は、CSS の最上位で使用することも、任意の CSS の条件付きグループアット規則の内部で使用することもできます。
構文
特性値のブロック
@swash
font-variant-alternates
のswash()
関数記法に渡される特性名を指定します。文字飾り (swash) の特性値に定義できる値は 1 個だけです。ident1: 2
は正しいですが、ident2: 2 4
は正しくありません。@annotation
font-variant-alternates
のannotation()
関数記法に渡される特性名を指定します。注釈 (annotation) 特性値に定義できる値は 1 個だけです。ident1: 2
は正しいですが、ident2: 2 4
は正しくありません。@ornaments
font-variant-alternates
のornaments()
関数記法に渡される特性名を指定します。装飾活字 (ornaments) の特性値に定義できる値は 1 個だけです。ident1: 2
は正しいですが、ident2: 2 4
は正しくありません。@stylistic
font-variant-alternates
のstylistic()
関数記法に渡される特性名を指定します。文字様式 (stylistic) の特性値に定義できる値は 1 個だけです。ident1: 2
は正しいですが、ident2: 2 4
は正しくありません。@styleset
font-variant-alternates
のstyleset()
関数記法に渡される特性名を指定します。ident1: 2 4 12 1
は、OpenType 値ss02
およびss04
,ss12
,ss01
にマッピングされます。99
よりも大きな値は正しいですが、どの OpenType 値にもマッピングされず、無視されます。@character-variant
font-variant-alternates
のcharacter-variant()
関数記法に渡される特性名を指定します。異体字 (character-variant) の特性値に定義できる値は 1 個または 2 個です。ident1: 3
はcv03=1
にマッピングされ、ident2: 2 4
はcv02=4
にマッピングされますが、ident2: 2 4 5
は無効です。
形式文法
@font-feature-values <family-name># { <feature-value-block-list> }where
<family-name> = <string> | <custom-ident>+
<feature-value-block-list> = <feature-value-block>+where
<feature-value-block> = <feature-type> '{' <feature-value-declaration-list> '}'
where
<feature-type> = @stylistic | @historical-forms | @styleset | @character-variant | @swash | @ornaments | @annotation
<feature-value-declaration-list> = <feature-value-declaration>where
<feature-value-declaration> = <custom-ident>: <integer>+;
例
@font-feature-values 規則内での @styleset の使用
/* "nice-style" を Font One に指定するアット規則 */
@font-feature-values Font One {
@styleset {
nice-style: 12;
}
}
/* Font Two における "nice-style" のためのアット規則 */
@font-feature-values Font Two {
@styleset {
nice-style: 4;
}
}
…
/* 1 回の宣言でアット規則を適用 */
.nice-look {
font-variant-alternates: styleset(nice-style);
}
仕様書
仕様書 | 状態 | 備考 |
---|---|---|
CSS Fonts Module Level 3 @font-feature-values の定義 |
勧告 | 初回定義 |
ブラウザーの互換性
BCD tables only load in the browser
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
関連情報
- このアット規則が定義する値を使用する
font-variant-alternates
プロパティ。