• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • font-feature-settings

    版本:CSS3

    font-feature-settings 属性用于控制OpenType字体中的高级印刷功能。

    示例

    /* 默认设置 */
    font-feature-settings: normal;
    
    /* 设置 OpenType 功能标签的值 */
    font-feature-settings: "smcp";
    font-feature-settings: "smcp" on;
    font-feature-settings: "swsh" 2;
    font-feature-settings: "smcp", "swsh" 2;
    
    /* 全局值 */
    font-feature-settings: inherit;
    font-feature-settings: initial;
    font-feature-settings: unset;
    

    浏览器支持

    IE浏览器火狐浏览器opera浏览器chrome浏览器safari浏览器
    IE10以上版本的浏览器都支持font-feature-settings

    语法

    font-feature-settings:normal| <string>[ <integer>| on| off]

    取值

    • normal:文本使用默认设置进行布局。
    • <string>:在呈现文本时,OpenType要素标记值的列表被传递到文本布局引擎以启用或禁用字体特征。标签始终是4个ASCII字符的<string>。如果是U + 20 - U + 7E代码点范围以外的字符或字符个数不对,则整个属性无效。
    • <integer>:是一个正整数。两个关键字onoff分别是10的同义词。如果未设置任何值,则默认值为1。对于非布尔型OpenType功能(例如,文体替代 stylistic alternates),该值意味着要选择特定的字形;对于布尔值,它是一个开关。
    默认值normal
    适用于所有元素,也适用于::first-letter::first-line
    继承性
    动画性discrete
    计算值指定值

    实例

    /* use small-cap alternate glyphs */
    .smallcaps { font-feature-settings: "smcp" on; }
    
    /* convert both upper and lowercase to small caps (affects punctuation also) */
    .allsmallcaps { font-feature-settings: "c2sc", "smcp"; }
    
    /* enable historical forms */
    .hist { font-feature-settings: "hist"; }
    
    /* disable common ligatures, usually on by default */
    .noligs { font-feature-settings: "liga" 0; }
    
    /* enable tabular (monospaced) figures */
    td.tabular { font-feature-settings: "tnum"; }
    
    /* enable automatic fractions */
    .fractions { font-feature-settings: "frac"; }
    
    /* use the second available swash character */
    .swash { font-feature-settings: "swsh" 2; }
    
    /* enable stylistic set 7 */
    .fancystyle {
      font-family: Gabriola; /* available on Windows 7, and on Mac OS */
      font-feature-settings: "ss07";
    }
    

    上篇:font-size-adjust

    下篇:font-kerning