| 属性名 | font-feature-settings |
|---|---|
| 値 | normal | <feature-tag-value>, ... |
| 値の詳細 | <feature-tag-value> = <string> [ <integer> | on | off ]? |
| 初期値 | normal |
| 適用可能要素 | すべての要素 |
| 継承 | 継承する |
| メディア | Visual |
| サポート | C3 / e10 / Fx4(-moz) / Ch16(-webkit) |
OpenType フォント自体が持つ低レベル制御機能を制御します。font-variant でサポートされているなら、極力 font-variant を使用することが推奨されています。
| 値 | 説明 |
|---|---|
| normal | 制御機能を利用しません。 |
| <feature-tag-value> | 4文字の機能名と、必要に応じでパラメータを指定します。on は 1 と、off は 0 と同じ意味を持ちます。カンマで連結することで、複数の機能を同時に指定することが可能です。(例: "liga", "swsh" 2) |
機能の詳細は下記のサイトで詳しく説明されています。
.none {
-webkit-font-feature-settings: normal;
-moz-font-feature-settings: normal;
-ms-font-feature-settings: normal;
font-feature-settings: normal;
}
.liga {
-webkit-font-feature-settings: "liga";
-moz-font-feature-settings: "liga";
-ms-font-feature-settings: "liga";
font-feature-settings: "liga";
}
.smcp {
-webkit-font-feature-settings: "smcp";
-moz-font-feature-settings: "smcp";
-ms-font-feature-settings: "smcp";
font-feature-settings: "smcp";
}
.c2sc {
-webkit-font-feature-settings: "c2sc";
-moz-font-feature-settings: "c2sc";
-ms-font-feature-settings: "c2sc";
font-feature-settings: "c2sc";
}
:
// <b>liga</b> <div style="font-family: 'メイリオ'"> <div class="none">fi fl などの文字が連結されます</div> <div class="liga">fi fl などの文字が連結されます</div> </div> <br> // <b>smcp</b> <div class="none">New York 小文字をスモールキャップスで表示します</div> <div class="smcp">New York 小文字をスモールキャップスで表示します</div> <br> // <b>c2sc</b> <div class="none">Google 大文字をスモールキャップスで表示します</div> <div class="c2sc">Google 大文字をスモールキャップスで表示します</div> :