html5中设置字体

浏览数：19 / 时间：2015年06月09日

@font-face指令在CSS2中引入,但是在HTMl5中实现的.

Web开放字体(WOFF)也是被所有浏览器支持的字体

大多数的字体是TrueType(TTF)和OpenType(PTF)而IE实现的是Embedded OpenType(EOT),还有一种可伸缩矢量图形(SVG)这种类型只被IOS系统支持

改变字体

FontSquirrel网站提供了我们所用字体的各种格式，已经能很好的满足我们的需求

1、定义字体

@font-face{	
	/*定义你要用的字体家族*/
	font-family:‘GarogierRegular‘;
	/*将需要的各种格式的字体下载下来放到stylesheets/fonts文件夹中*/
	/*.eof文件的?#iefix前缀用于修复IE8中的一个严重的语法解析Bug,忽略该前缀将导致IE8在解析剩余规则时产生404错误,问号的作用是将让IE8把eot之后的内容作为查询参数*/
        /*字体的链接位置是相对于样式表而不是HTMLd页面*/	       
	src:url(‘fonts/garogier_unhinted-wetbot.eot?#iefix‘) format(‘embedded-opentype‘),
            url(‘fonts/garogier_unhinted-wetfont.woff‘) format(‘woff‘),

            url(‘fonts/garogier_unhinted-wetfont.ttf‘) format(‘ttf‘),
            url(‘fonts/garogier_unhinted-webfont.svg#garogierregular‘) format(‘svb‘);
	font-weight:normal;
	font-style:normal;	
}

2、应用字体

body{
	font-family:"GarogierRegular";
}

/*也可能存在浏览器不支持我们的字体的时候.因此要准备多个备用字体上面的代码可改为*/

/*

CSS中分为两种字体:通用字体系列和特殊字体系列

CSS提供了5种通用字体系列

	Serif 字体
	Sans-serif 字体
	Monospace 字体
	Cursive 字体
	Fantasy 字体
因此我们一般都会在特殊字体系列最后加上一个通用字体

*/

body{
	font-family:"GarogierRegular",Georgia,
	            "Palatino","Palatino Linotype",
		    "Times","Times New Roman",serif;
}
我们可以发现上面的字体有的加了引号,当字体名称中有一个多个引号或有$#这样的特殊字符时需要用引号引起来,单引双引都可以.

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

html5中设置字体