字体变位 | font-variant-position (Fonts) – CSS 中文开发手册

[
  •   CSS 中文开发手册

    字体变位 | font-variant-position (Fonts) - CSS 中文开发手册

    font-variant-positionCSS属性控制被定位为标或下标相对于字体的基线替代,更小的字形的使用。这些字形可能被用在<sub>和<sup>元素中。

    font-variant-position: normal;
    font-variant-position: sub;
    font-variant-position: super;
    
    /* Global values */
    font-variant-position: inherit;
    font-variant-position: initial;
    font-variant-position: unset;

    当这些替代字形被激活时,如果一个字符在运行中没有这样的字体增强的字形,则使用回退方法来渲染整个字符集合,以合成这些字形。

    这些替代字形与字体的其余部分共享相同的em-box和相同的基线。它们仅仅是图形增强的,对线高和其他特性没有影响。

    初始值

    normal

    应用于

    all elements. It also applies to ::first-letter and ::first-line.

    继承

    yes

    使用媒体

    visual

    计算值

    as specified

    动画类型

    discrete

    规范顺序

    the unique non-ambiguous order defined by the formal grammar

    语法

    font-variant-position属性指定为下面列出的关键字值之一。

    取值

    normal取消激活替代上标和下标字形。

    sub激活下标替代字形。如果在一个给定的运行中,一个这样的字形对一个字符不可用,那么运行中的所有字符都将使用合成的字形进行渲染。

    super激活上标替代字形。如果在一个给定的运行中,一个这样的字形对一个字符不可用,那么运行中的所有字符都将使用合成的字形进行渲染。

    形式语法

    normal | sub | super

    实例

    <p class="normal">Normal!</p>
    <p class="super">Super!</p>
    <p class="sub">Sub!</p>
     
    p {
      display: inline;     
    }
    
    .normal {
      font-variant-position: normal;
    }
    
    .super {
      font-variant-position: super;
    }
    
    .sub {
      font-variant-position: sub;
    }

    结果

    规范

    Specification

    Status

    Comment

    CSS Fonts Module Level 3The definition of 'font-variant-position' in that specification.

    Candidate Recommendation

    Initial definition.

    浏览器兼容性

    Feature

    Firefox (Gecko)

    Chrome

    Internet Explorer

    Opera

    Safari (WebKit)

    Basic support

    34 (34) 1

    ?

    ?

    ?

    ?

    Feature

    Android

    Firefox Mobile (Gecko)

    IE Phone

    Opera Mobile

    Safari Mobile

    Basic support

    ?

    34.0 (34)1

    ?

    ?

    ?

  •   CSS 中文开发手册
    ]
    转载请保留页面地址:https://www.breakyizhan.com/css/31859.html

    posted on 2020-07-12 00:51  MrAit  阅读(317)  评论(0编辑  收藏  举报

    导航