详解CSS字体属性font-style中的italic与oblique的区别!
详解CSS字体属性font-style中的italic与oblique的区别!
在此之前先了解两个问题:浏览器中显示的字体从哪儿来?浏览器又支持哪些字体?
浏览器中显示的字体样式取决于用户本地电脑是否已经安装了该字体。 就是说只要用户电脑中安装了相应的字体,那浏览器就可以显示出相应的字体! 所以说浏览器支持所有你能想到的字体。
结论:浏览器支持所有你能想到的字体!
1.如何查看我的电脑安装了哪些字体?
依次打开本地电脑的控制面板,外观和个性化,字体
这里便是电脑的字体库。
2.双击打开第一个字体
进去可以看到,Arial字体系列 提供了正常体,粗体,斜体,黑体等多种样式,看到这里聪明的你应该明白了italic与oblique的区别了。
3.italic与oblique的区别:
文档中对这两个属性值的解释: italic 浏览器会显示一个斜体的字体样式。 oblique 浏览器会显示一个倾斜的字体样式。
首先两者都可以实现倾斜效果,但不一定都会生效 italic 根据英文释义是斜体字,所以这个属性显示的前提是已经在电脑中安装了的斜体字,否则是没有效果的, 比如Arial字体系列里就有 Arial 斜体 这个字体!而华文琥珀字体则没有斜体! oblique 准确的语义是指把文字进行倾斜,对于没有斜体字的字体,比如华文琥珀,这个时候就只能用oblique了。 在实际使用中没有斜体字的字体使用italic也会出现斜体,维基百科给出的解释是,大多数字体都没有经过斜体设计, 当电脑指令在调用没有斜体字的字体时,程序会自动把字体倾斜,我们看到的其实是‘伪‘斜体,几乎看不出区别而已。
4.世界上有那么多字体,不可能让电脑全部下载,有统一的标准吗?
W3C工作组约定了5类通用字体:"serif"、"sans-serif"、"cursive"、"fantasy"、"monospace",
浏览器会根据用户电脑的设定选择对应的某一种字体或默认字体来渲染显示。你看到的字体类型基本上都在这约定五类中,在很大程度上保证了不同用户显示效果的一致性。
5.电脑中没有我想要的使用的字体?
在css里定义字体路径,下载到用户的电脑中
@font-face { font-family: 自定义的字体; src:url('字体文件1.woff'), url('字体文件2.ttf'), url('字体文件3.eot'); }