Css Opentype具有跨浏览器兼容性
我试图利用myfonts中“Plantin MT Pro”的opentype功能。更具体地说,我希望使用“真正的”小大写字母和旧式编号。所谓“真正的”小大写字母,我的意思是,如果可能的话,我不希望通过字体变体选择器模仿小大写字母 下面的css在Chrome和Opera上取得了成功,但在Firefox和Safari上却没有成功(不确定为什么Safari不能工作,但Chrome可以,两者都是webkit?) 使用下面的CSS,我似乎无法根据当前的支持达到我想要的效果,但是有可能针对特定的浏览器,在必要的时候模仿小型大写字母作为备用吗?i、 eCss Opentype具有跨浏览器兼容性,css,firefox,webkit,opentype,Css,Firefox,Webkit,Opentype,我试图利用myfonts中“Plantin MT Pro”的opentype功能。更具体地说,我希望使用“真正的”小大写字母和旧式编号。所谓“真正的”小大写字母,我的意思是,如果可能的话,我不希望通过字体变体选择器模仿小大写字母 下面的css在Chrome和Opera上取得了成功,但在Firefox和Safari上却没有成功(不确定为什么Safari不能工作,但Chrome可以,两者都是webkit?) 使用下面的CSS,我似乎无法根据当前的支持达到我想要的效果,但是有可能针对特定的浏览器,在必
-webkit字体变体:小写代码>
这对我来说暂时不起作用,任何有帮助的信息都会非常有用。话虽如此,我也不确定为什么字体功能设置在每个浏览器中都不起作用,正如
查看my,并在上述4种浏览器中进行测试
谢谢
p {
font-family: PlantinMTPro-Light, Georgia, "Times New Roman", Times, serif;
font-weight: normal;
font-style: normal;
font-kerning: normal;
font-size: 0.9em;
letter-spacing: 1px;
line-height: 1.8em;
text-transform: lowercase;
-moz-font-feature-settings: "smcp" 1, "c2sc" 1, "onum" 1, "kern" 1;
-moz-font-feature-settings: "smcp=1, c2sc=1, onum=1, kern=1";
-ms-font-feature-settings: "smcp" 1, "c2sc" 1, "onum" 1, "kern" 1;
-o-font-feature-settings: "smcp" 1, "c2sc" 1, "onum" 1, "kern" 1;
-webkit-font-feature-settings: "smcp" 1, "c2sc" 1, "onum" 1, "kern" 1;
font-feature-settings: "smcp" 1, "c2sc" 1, "onum" 1, "kern" 1;
}
不幸的是,目前的支持似乎无法实现这一点(Safari在这方面出人意料地落后),因此我不得不决定将font-feature settings
用于工作的小型大写部分。我将改用font variant:small caps
,直到浏览器的采用率赶上。但是,我将保留旧式编号的字体功能设置
,以便在支持时显示
我希望这对某些人有用,并且我希望将来能够更充分地使用这一功能
p {
font-family: PlantinMTPro-Light, Georgia, "Times New Roman", Times, serif;
font-weight: 500;
font-style: normal;
font-kerning: normal;
font-variant: small-caps; /* Used instead of font-feature-settings to improve x-browser compatibility */
font-size: 0.95em;
font-style: normal;
font-kerning: normal;
letter-spacing: 1px;
line-height: 1.8em;
text-transform: lowercase;
-moz-font-feature-settings: "onum" 1, "kern" 1;
-moz-font-feature-settings: "onum=1, kern=1";
-ms-font-feature-settings: "onum" 1, "kern" 1;
-o-font-feature-settings: "onum" 1, "kern" 1;
-webkit-font-feature-settings: "onum" 1, "kern" 1;
font-feature-settings: "onum" 1, "kern" 1;
}