Web字体格式介绍及浏览器兼容性⼀览
svg图形 ⽬前,⽂字信息仍是⽹站最主要的内容,随着CSS3技术的不断成熟,Web字体逐渐成为话题,这项让未来Web更加丰富多彩的技术拥有多种实现⽅案,其中之⼀是通过@font-face属性在⽹页中嵌⼊⾃定义字体,主流的浏览器都⽀持这项技术,本⽂介绍主要的⼏种Web字体格式及各浏览器兼容情况。
TrueType (.t tf)
Windows和Mac系统最常⽤的字体格式,其最⼤的特点就是它是由⼀种数学模式来进⾏定义的基于轮廓技术的字体,这使得它们⽐基于⽮量的字体更容易处理,保证了屏幕与打印输出的⼀致性。同时,这类字体和⽮量字体⼀样可以随意缩放、旋转⽽不必担⼼会出现锯齿。EOT – Embedded Open Type (.e ot)
嵌⼊字体格式(EOT)是微软开发的⼀种技术,允许 OpenType 字体嵌⼊到⽹页并可以下载⾄浏览器渲染,浏览器根据 CSS 中 @font-face 的定义,下载,渲染这种 .EOT 后缀的字体⽂件。这些⽂件只在当前页活动的状态下,临时安装在⽤户的系统中。
OpenType (.otf)
OpenType是⼀种可缩放字型(scalable font)电脑字体类型,采⽤PostScript格式,是美国微软公司与Adobe公司联合开发,⽤来替代TrueType字型的新字型。这类字体的⽂件扩展名为.otf,类型代码是OTTO,现⾏标准为OpenType 1.4。OpenType最初发表于1996年,并在2000年之后出现⼤量字体。它源于微软公司的TrueType Open字型,TrueType Open字型⼜源于TrueType字型。OpenType font包括了Adobe CID-Keyed font技术。Adobe公司已经在2002年末将其字体库全部改⽤OpenType格式。
WOFF – Web Open Font Format (.w off)
相对于 TrueType 和 OpenType ,WOFF(Web开发字体格式)是⼀种专门为了 Web ⽽设计的字体格式标准,它并不复杂,实际上只是对于 TrueType / OpenType 等字体格式的封装,并针对⽹络使⽤加以优化:每个字体⽂件中含有字体以及针对字体的元数据(Metadata),字体⽂件被压缩,以便于⽹络传输,并且不包含任何加密或者 DRM 措施。包括 Adobe、 Lino Type、Monotype 在内的⼏乎所有主要的字体供应商都加⼊到⽀持 WOFF 的⾏列中来
SVG (Scalable Vector Graphics) Fonts (.s vg)
顾名思义,就是使⽤SVG技术来呈现字体,还有⼀种gzip压缩格式的SVG字体.svgz。SVG可缩放⽮量图形(Scalable Vector Graphics)是基于可扩展标记语⾔(XML),⽤于描述⼆维⽮量图形的⼀种图形格式。SVG由W3C制定,是⼀个开放标准。SVG严格遵从XML语法,并⽤⽂本格式的描述性语⾔来描述图像内容,因此是⼀种和图像分辨率⽆关的⽮量图形格式。SVG可以使你设计的⽹页可以更加精彩细致,使⽤简单的⽂本命令,SVG可实现⾊彩线性变化、路径、⾃定义字体、透明效果、滤镜效果等各式常见的图形图像效果。
EOTFast
这个⼯具我刚⽤过,⾮常好⽤的⼀个⼯具,⽤于把TTF⽂件转为EOT格式。
Microsoft WEFT
微软提供的字体格式转换⼯具。
ttf2eot
可以转换TTF⽂件为EOT格式。
另外推荐⼏个在线的转换⼯具:
如果想把OTF⽂件转为TTF格式,可以使⽤来转换。
使⽤CSS3的@font-face属性可以实现在⽹页中嵌⼊任意字体,但是IE只⽀持微软⾃有的EOT格式字体,⽽其他浏览器都不⽀持这⼀字体格式,其它浏览器可以设置TTF(TrueType)和OTF(OpenType)两种字体作为⾃定义字体,浏览器对@font-face属性及各种字体格式⽀持详的细情况如下:
Browser@font-face TrueType WOFF EOT SVG SVGZ IE4+9+9+4+
⽕狐 3.5+ 3.5+ 3.6+
⾕歌4+4+6+4+6+
苹果 3.1+ 3.1+6+ 3.1+ 3.1+
opera10+10+11.1+10+10+
在线字体转换⽹址:
(来源:原⽂:)
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论