你的位置:首页 > 网页设计

[网页设计]html5中设置字体


@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;}我们可以发现上面的字体有的加了引号,当字体名称中有一个多个引号或有$#这样的特殊字符时需要用引号引起来,单引双引都可以.