首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

字体变位 | font-variant-position

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

代码语言:javascript
复制
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激活上标替代字形。如果在一个给定的运行中,一个这样的字形对一个字符不可用,那么运行中的所有字符都将使用合成的字形进行渲染。

形式语法

代码语言:javascript
复制
normal | sub | super

实例

代码语言:javascript
复制
<p class="normal">Normal!</p>
<p class="super">Super!</p>
<p class="sub">Sub!</p>
 
代码语言:javascript
复制
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

?

?

?

扫码关注腾讯云开发者

领取腾讯云代金券