04
2013-09

如何用CSS3为自己的网页定义特殊字体?

       在做网页的时候,会遇到某些字体不支持的情况,这个时候怎么办呢?在CSS3中,有一种定义可以轻松帮你解决,在样式中定义自己网页的特殊字体!

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
@font-face{
    font-family:myFont;
    src:url('Sansation_Light.ttf'),url('Sansation_Light.eto');
    }
@font-face{
    font-family:myFont;
    src:url('Sansation_Bold.ttf'),url('Sansation_Bold.eot');
}
div{font-family:myFont;}
</style>
</head>
                  
<body>
<div>窗前明月光,beautiful疑是地上霜。123456hpiewpfrkpwkf;s举头望明月,低头思故乡。bed yue yue guang</div>
</body>
</html>

本段代码Demo:点击预览

本代码中所需字体下载:

Sansation_Light.ttf

Sansation_Light.eot

Sansation_Bold.ttf

Sansation_Bold.eot


除非注明,文章均为史亚永原创,欢迎转载!转载请注明本文地址,谢谢。

本文地址:http://www.shiyayong.cn/post/218.html

评论列表:

5  Leniy  2013-9-10 20:54:48 回复该留言  IP:112.53.69.6
我只用了幾個圖像字體,作為每篇文章的meta的標識
  茶馆老板  2014-1-17 16:19:36 回复该留言  IP:117.121.48.242
这个是为了满足一些对自提的特殊需求来写的,有demo的
茶馆老板
Leniy
4  车饰品  2013-9-8 8:25:13 回复该留言  IP:59.56.120.31
不同的特殊字体有不同的代码吗?
  茶馆老板  2014-1-17 16:18:56 回复该留言  IP:117.121.48.242
这是根据你选择的文字来规定的,有些字体样式只支持英文的
茶馆老板
车饰品
3  chuanyi  2013-9-8 8:24:36 回复该留言  IP:59.56.120.31
奥,我不懂。。。
  茶馆老板  2014-1-17 16:18:19 回复该留言  IP:117.121.48.242
不懂没关系,我刚上传了demo你可以看看文字的区别,不过好像只针对英文有效果
茶馆老板
chuanyi
2  枣庄期货  2013-9-7 17:39:32 回复该留言  IP:210.22.59.29
这招在样式中定义自己网页的特殊字体的代码很管用,刚试了。
  茶馆老板  2014-1-17 16:08:55 回复该留言  IP:117.121.48.242
效果是自己想要的嘛?
茶馆老板
枣庄期货
1  夏日博客  2013-9-5 10:53:31 回复该留言  IP:124.207.123.36
css3是CSS控制样式的版本么。
  茶馆老板  2014-1-17 16:04:47 回复该留言  IP:117.121.48.242
css3是css的版本,之前咱们用的是css2,就想php的版本一样
茶馆老板
夏日博客

发表评论:

(设置个性头像)

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

无觅相关文章插件,快速提升流量