CSS参考手册
字体 | Fonts
字体变体交替 | font-variant-alternates
font-variant-alternates
CSS属性控制替代字形的使用。这些替代字形可以通过中定义的替代名称来引用@font-feature-values
。
font-variant-alternates: normal;
font-variant-alternates: historical-forms;
font-variant-alternates: stylistic(user-defined-ident);
font-variant-alternates: styleset(user-defined-ident);
font-variant-alternates: character-variant(user-defined-ident);
font-variant-alternates: swash(user-defined-ident);
font-variant-alternates: ornaments(user-defined-ident);
font-variant-alternates: annotation(user-defined-ident);
font-variant-alternates: swash(ident1) annotation(ident2);
/* Global values */
font-variant-alternates: initial;
font-variant-alternates: inherit;
font-variant-alternates: unset;
所述@font-feature-values
在规则可以定义替代字形函数的名称(stylistic
,styleset
,character-variant
,swash
,ornament
或annotation
),相关联的OpenType参数的名称。这个属性允许@font-feature-values
样式表中的人们可读的名字(定义在)中。
初始值 |
normal |
---|---|
应用于 |
all elements. It also applies to ::first-letter and ::first-line. |
是否继承 |
yes |
支持的媒体 |
visual |
计算值 |
as specified |
动画类型 |
discrete |
规范顺序 |
order of appearance in the formal grammar of the values |
语法
值可以采取两种形式之一:
- 关键字
normal
- 或以下列出的一个或多个其他关键字和功能,以任何顺序空格分隔。
值
normal
该关键字可以禁用替代字形。
historical-forms
这个关键字使历史形式 - 过去常见但不是今天的字形。它对应于OpentType的值hist
。
stylistic()
这个功能可以为个别角色改变文体。该参数是映射到数字的特定于字体的名称。它对应于OpenType的值salt
,如salt 2
。
styleset()
这个功能可以为角色集合提供文体选择。该参数是映射到数字的特定于字体的名称。它对应于OpenType的值ssXY
,如ss02
。
character-variant()
这个功能可以为角色提供一套文体选择。它与styleset()
类似,但不会为一组字符创建连贯的字形; 个人角色将有独立的,不一定是连贯的风格。该参数是映射到数字的特定于字体的名称。它对应于OpenType的值cvXY
,如cv02
。
swash()
这个函数启用了斜杠字形。该参数是映射到数字的特定于字体的名称。它对应的OpenType值swsh
和cswh
,如swsh 2
和cswh 2
。
ornaments()
这个功能可以使装饰,如花草和其他丁字形雕文。该参数是映射到数字的特定于字体的名称。它对应的OpenType值ornm
一样ornm 2
。
注意:为了保留文本语义,字体设计师应该包括不符合Unicode dingbat字符作为子弹字符(U + 2022)的装饰变体的装饰物。格式良好的字体可以做到这一点,但是一些现有的字体却没有。
annotation()
此函数支持注释,如圈形数字或倒排字符。该参数是映射到数字的特定字体名称.。它对应于OpenType值nalt
,就像nalt 2
...
形式语法
normal | [ stylistic( <feature-value-name> ) || historical-forms || styleset( <feature-value-name># ) || character-variant( <feature-value-name># ) || swash( <feature-value-name> ) || ornaments( <feature-value-name> ) || annotation( <feature-value-name> ) ]where
<feature-value-name> = <custom-ident>
例
HTML
<p>Firefox rocks!</p>
<p class="variant">Firefox rocks!</p>
CSS
.variant {
font-family: Leitura Display Swashes;
font-variant-alternates: swash(2);
}
结果
注:您需要安装OpenType字体莱图拉显示花边此示例才能工作。
规范
Specification |
Status |
Comment |
---|---|---|
CSS Fonts Module Level 3The definition of 'font-variant-alternates' 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 |
? |
? |
? |
字体 | Fonts相关
层叠样式表( Cascading Style Sheets )是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。