| 属性名 | font-synthesis-small-caps |
|---|---|
| 値 | auto | none |
| 初期値 | auto |
| 適用可能要素 | すべての要素およびテキスト |
| 継承 | 継承する |
| サポート | https://caniuse.com/mdn-css_properties_font-synthesis-small-caps |
使用するフォントが、font-variant-caps で指定されたスモールキャプスフォント(小文字の高さの大文字フォント)をサポートしていない場合、利用可能なフォントから自動生成して表示するか否かをしていします。デフォルトでは自動生成します。
下記の例ではスモールキャプスをサポートしない Noto Sans JP フォントを読み込んでいます。最初の Japan はスモールキャプスフォントをブラウザが自動生成していますが、2番目の Japan は自動生成が抑止されています。
.my-example {
font-family: "Noto Sans JP";
font-variant-caps: small-caps;
font-size: 32px;
}
.fss-none {
font-synthesis-small-caps: none;
}
<head> ... <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400&display=swap" rel="stylesheet"> ... </head> <body> ... <span class="my-example">Japan</span> <span class="my-example fss-none">Japan</span> ... </body>