推荐一个jQuery Mobile的快速技巧：如何使用@Font-face

最新推荐文章于 2021-05-16 13:43:30 发布

HR招聘linux

最新推荐文章于 2021-05-16 13:43:30 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/bookzhaopin/article/details/38067305

版权

jquery Mobile 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

有几个字体更换方法可以使用，比如cufon、sIFR、FLIR、@font-face和Google Fonts API。使用jQuery Mobile构建web应用程序时，我发现@font-face方法是用起来最容易的方法，其性能让人相当满意。

最终代码如下：

@font-face {
font-family: 'blok-regular';
src: url('type/Blokletters-Potlood.eot');
src: local('Blokletters Potlood Potlood'), 
 local('Blokletters-Potlood'), 
 url('type/Blokletters-Potlood.ttf') format('truetype');
}
 
@font-face {
font-family: 'blok-italic';
src: url('type/Blokletters-Balpen.eot');
src: local('Blokletters Balpen Balpen'), 
 local('Blokletters-Balpen'), 
 url('type/Blokletters-Balpen.ttf') format('truetype');
}
 
@font-face {
font-family: 'blok-heavy';
src: url('type/Blokletters-Viltstift.eot');
src: local('Blokletters Viltstift Viltstift'), 
 local('Blokletters-Viltstift'), 
 url('type/Blokletters-Viltstift.ttf') format('truetype');
}
 
h1 { font-family: blok-heavy, helvetica, arial; }