font-synthesis属性(CSS设置)
font-synthesis属性(CSS设置)
CSS1界说的字体特点包括：font-family、font-style、font-variant、font-weight、font-size和font。其算法要求UA(UserAgent，用户署理)对给定元素中的字符逐一查找匹配的CSS特点，首要测验匹配font-style，比方italic和oblique。然后匹配font-variant，normal匹配非small-caps(小型大写)字体，而small-caps则匹配(1)标识为small-caps的字体(2)组成小型大写字母的字体(3)将小写字母替换为大写字母的字体(小型大写字母能够经过将normal字体的大写字母缩小来实现)。接着匹配font-weight和font-size，这两个特点都是必须匹配成功的。
font-family是一个依照优先级摆放的字体或通用字体姓名的列表，每个姓名以逗号分隔，表明多选一。
有两种值：字体名和通用字体名。在上面的比方中，gill和helvetica便是清晰指定的字体名，而sans-serif则是通用字体名。CSS1界说了5种通用字体：
serif：衬线
sans-serif：非衬线
cursive：手写
fantasy：装修
monospace：等宽
一般，除了指定特定的字体名，终究都应该指定一个通用字体名。别的，假如字体名包括空格，必须用引号括起来。
font-style有3个值：normal、italic和oblique。noraml便是正常字体，而italic是斜体，oblique有或许是将正常字体歪斜后得到的。关于italic而言，假如没有italic字体，则运用oblique。
一般字体姓名中包括Oblique、Slanted或Incline的，UA一般将其归类为oblique；而字体姓名中包括Italic、Cursive或Kursiv的，UA则将其归类为italic。
font-variant首要用于指定normal和small-caps。真实的small-caps字体的字母比大写字母小一些，而且份额也稍有差异。但是，假如不是真实的small-caps字体，也能够将normal字体中的大写字母缩小后代替。真实不可，也能够直接用大写字母。
CSS1只支撑small-caps一种变体，不支撑旧式数字、小型大写数字、紧缩或疏松字母等其他变体。
font-weight选择字重，有关键字值normal、bold、bolder、lighter和数值100~900，表明笔画越来越粗。normal对应400，bold对应700。bolder和lighter则相关于从父元素继承的字重加粗或变细。实际中的字体(字体数据)都会有一个或几个特点的值用于描述字体的"重量"。但不同字体运用的特点值并不一致，比方包括以下关键字的值好像都能够认为是粗体：Regular、Roman、Book、Medium、Semi-、DemiBold、Bold或Black，详细要看其normal字形有多重。正由于如此，CSS1才界说了一系列数值。
OpenType运用9个数值区分字重，能够直接对应。但并非一切字体都有那么多字重，CSS1为此也界说了怎么向前或向后"寻值"，比方500假如没有，则用400。
font-size界说了绝对值、相对值、长度值和百分比值。绝对值包括xx-small、x-small、small、medium、large、x-large和xx-large等关键字，它们在UA里以1.5倍的份额差异保存着绝对大小。相对值有larger和smaller关键字，取决于父元素文本大小的绝对值。不允许负值。
终究，font是以上一切特点的简写特点，能够一起设置font-style、font-variant、font-weight、font-size、line-height和font-family。这个特点借鉴了传统排版中的一起设置多个特点的简写法。
CascadingStyleSheetsLevel2Revision1(CSS2.1)
CSS1奠定了字体特点的格式。CSS2.1仅对CSS1进行了补充和扩展。
首要，CSS1只规矩font-family终究要运用一种通用字体作为后备，并没有详细阐明这些字体的特点和举例。CSS2.1则详细解读了serif、sans-serif、cursive、fantasy和monospace。
其次，对一切特点一致增加了inherit关键字。而且，font-variant仍然只支撑small-caps一种变体方式。
终究，CSS2.1比较重要的一个增补，是为font简写特点增加了6种体系字体关键字：
caption、icon、menu、message-box、small-caption和status-bar。比方，经过font:menu;能够让网页中的某个元素继承体系菜单中运用的字体及特点。假定体系菜单运用了12像素、字重600的Times，则font:menu就相当于：
由于体系字体的款式只能整体继承，不能独自获取，所以只能经过font简写特点来继承体系字体的款式。别的，由于font简写特点会将一切没有清晰给出的值重置为相应的初始值，所以上面的声明又相当于：
CSSFontsModuleLevel3
我们知道，从CSS3开端，CSS规范被拆成很多模块独自晋级，新的需求也会作为一个新模块来立项并标准化。在CSS2.1之后，CSS中关于字体的内容就独立为CSS3Fonts模块。一起为了支撑可下载的自界说字体，又创建了CSS3WebFonts模块。
但终究，CSS3Fonts和CSS3WebFonts合并为CSSFontsModuleLevel3（以下简称"ML3"）。后来，ML3中触及字体加载的内容，又独立为CSSFontLoadingModuleLevel3。
ML3进一步细化了CSS字体特点的内在和外延。比方，关于font-family字体列表中出现的字体名。ML3就进一步阐明：
字体名只指定一种字体的姓名，而不能指定该种字体中某一个字体。比方，Futura是一种字体，它又包括FuturaMedium、FuturaMediumItalic、FuturaCondensedMedium和FuturaCondensedExtraBold字体。
ML3还增加了font-stretch特点，用于从字体中选择正常、紧缩或疏松的字形，有以下关键字值：
ultra-condensed
extra-condensed
condensed
semi-condensed
normal
semi-expanded
expanded
extra-expanded
ultra-expanded
别的，关于之前font-style特点所谓的"伪斜体"关键字oblique，也能够经过font-synthesis特点设置是否启用。由于对某些文字，比方西里尔文字，真实的斜体与人工组成的斜体差别很大。比方，下面的规矩制止UA组成阿拉伯文斜体：
ML3还增加了font-size-adjust特点，用于在运用备用字体时，依然能坚持本来所要运用字体的纵横比（小写字母与大写字母的相对高度），从而确保可读性。
@font-face
如前所述，ML3最大的改变便是增加了FontResource一节。这一节界说了@font-face规矩，@font-face规矩用于界说一个（种）新的字体，其特点由包括在花括号内的规矩描述符声明决议。其间，font-family和src是必需的描述符。(注意，在普通CSS声明里，font-family和src是特点，而在@font-face规矩里，由于是用于界说新字体，所以font-family和src就成了描述符，即用于描述新字体的特点。)
font-family描述符界说字体姓名，会掩盖底层字体文件中的姓名，而且假如姓名跟体系字体冲突，还会掩盖体系字体。
src描述符界说字体的来历，其值为按优先次序摆放的来历列表，来历本地运用local()引入，来历外部运用url()引入。运用url()引入外部字体时，能够用format()增加字体格式的提示。ML3界说的有效字体格式字符串有：
此外，由于OpenType是TrueType超集和扩展，字符串"truetype"和"opentype"表明的意思是一样的。
在运用local()加载本地字体时，由于UA要匹配字体文件中包括的全名，而同一字体在不同渠道下的全名或许不一样，因而需要指定一切或许的姓名，以便跨渠道运用。
local()函数很有用，比方上面的比方其实是为不同渠道下的同一款字体创建了一个一致的别名。再比方下面的比方，用于将一种大字体中永远都不会被引用到的字体抽取出来：
别的，ML3规矩UA只能优先运用字体文件中的英文全名来匹配字体。即便用户操作体系将区域设置为比方德国、芬兰，而字体文件中也有德语、芬兰语的字体全名，也要匹配英文全名，这是为了全渠道一致起见。因而下面h2终究会运用默许的衬线字体：
终究，假如存在多个src描述符，后声明的会掩盖先声明的：
font-style、font-weight和font-stretch这三个描述符的值跟对应特点的值一样，仅仅不允许运用相对关键字bolder和lighter。
综上所述，@font-face规矩的引入为CSS字体的运用提供了很大便当。事实上，只要结合马上要出场的unicode-range描述符，@font-face规矩才干发挥出最大的潜力。
unicode-range
unicode-range描述符用于指定当时界说字体支撑的Unicode码点(codepoint)，是一个逗号分隔的Unicode规模值。这相当于界说了一个字符集，UA能够依据这个字符集来决议针对某个文字是否需要下载新字体。
Unicode规模值支撑单个码点(如U+416)、码点区间(如U+400-4ff)和通配规模(如U+4??)。
那么Unicdoe规模或许说字符规模(字符集)有什么用呢？能够用多个@font-face规矩和不同的Unicode规模共同界说一个复合型字体。换句话说，能够在一个自界说字体中包括来自不同语言文字的多个字体的不同字形，也能够界说一个只包括某种字体常用或罕用字符的新字体。假如同一个新字体的多个@font-face规矩中的Unicode规模有重合，那么终究界说的规矩先匹配。
下面的规矩会基于日文字体Msmincho和英文字体Gentium界说一个新字体JapaneseWithGentium，其间拉丁字母的字形来自Gentium字体，其他字形来自Msmincho。
运用@font-face的层叠规矩，还能够实现对字体的"按需下载"。比方，在下面的比方，假如只需要拉丁字符的字形，UA只会下载DroidSans.woff。
ML3规矩，@font-face指定的字体资源选用懒加载战略，即假如不用到，就不下载。款式表里能够界说很多@font-face，但UA必须只下载那些款式规矩中引用到的字体。有一个例外便是当自界说字体作为后备字体时，UA能够提早下载，比方：
一般情况下，页面都会先于字体加载完。此刻运用自界说字体的文本应该怎么显现呢？ML3规矩UA能够依照自界说字体不可用的情形来烘托字体，或许用后备字体将文本烘托为通明的。但在自界说字体下载失败后，UA必须显现文本。因而，ML3也要求款式表作者指定与自界说字体大小相似的后备字体。
关于字体的获取，ML3规矩必须运用启用CORS的手法，运用Anonymous方式，将referrer设置为款式表的URL，将origin设置为包括款式表的文档的URL。
关于字体匹配，ML3是有史以来最详细的。它增加了font-stretch的匹配，罗列出了font-style一切或许的匹配情形。small-caps彻底从字体匹配流程中剥离，由字体特性来处理。要求必须运用Unicode变体选择符。簇序列作为一个单位匹配。
字体特性
如前所述，font-variant特点一直以来只要一个small-caps变体。而实践中运用的字体远不止只要小型大写字母一种改变方式。为此，ML3扩展了font-variant特点，使其成为了控制一切款式相关字体特性的一个简写特点。
换句话说，font-variant有了font-variant-ligatures、font-variant-postion、font-variant-caps、font-variant-numeric、font-variant-east-asian等详细特点。
字体特性能够经过font-variant或font-feature-settings来启用。详细细节由于触及英文字体的很多陈旧传统，有爱好的读者能够自行学习。
尾声
CSSFontModuleLevel3在2018年9月成为W3C推荐标准，随即又开端了CSSFontsModuleLevel4，包括了一些CSS字体相关的试验性特性。别的，从CSSFontModuleLevel3中独立出去的CSSFontLoadingModuleLevel3现已得到主流浏览器较新版本的支撑。作者：曼珠沙华是神https://www.bilibili.com/read/cv9041255/出处：bilibili
作品标签： CSS
优秀作品：
评论列表（共17人参与）参与讨论或分享设计作品获得视觉癖积分奖励
?p??p注册会员
2021-08-24 11:53:34
iv> 5．人生需求一些风情装点的。便是咱们的灵魂总要一点点历史的问候，一些诗意的触摸，一些天然的慰藉。 6．有些美好，很简略。你说一句晚电气设计、施工人员和电气工程师使用，一起可供电气监理人员参考，也可作为大专院校相关专业师生学习材料。
回复
那时的咱注册会员
2021-08-24 10:38:56
三月的温文透游客
2021-08-24 6:44:4
游客69207：font-synthesis属：times、courier、arial。 通常字体系列名称：比如：serif&q 2、疲倦的日常生活要有一些溫柔的理想。例如遇上一次粉红色的云，看场灿烂的烟花，相拥仍在身旁的你 3、一些女生一而再再而
回复