apache字体文件跨域_icon font字体的跨域访问问题

现在主流浏览器(包括IE6)都支持CSS3的自定义字体(@font-face)，因此可以尝试使用font来替换图片展示网站的各种icon。但是各浏览器对于字体文件格式的支持不尽一致。目前主流浏览器对于icon font的支持如下：

IE：从IE4开始支持eot格式，IE9开始支持woff。

webkit/safari：支持TrueType/OpenType(.ttf)，OpenTypePS(.otf)，iOS4.2+支持.ttf，iOS 4.2以下只支持SVG字体； Safari5.1+ 开始支持woff格式

Chrome：除webkit支持的以外，从Chrome 6开始，开始支持woff格式；

Firefox：支持.ttf和.otf，从Firefox 3.6开始支持woff格式；

Opera：支持.ttf、.otf、.svg。 Opera 11开始支持woff；

iPad, iPhone and Android 3.0+ 支持SVG fonts

在使用icon font字体的时候，发现在firefox 及ie9下icon font字体不显示，也就是通常说的firefox和IE9不支持对icon font字体的跨域访问。

解决方法

可以将字体文件放到同域的服务器上或修改服务器配置。

把如下代码加到你的服务器配置文件中去，我用的是apache2，这里我的配置文件路径为Apache2\conf\httpd.conf

AddType application/vnd.ms-fontobject .eot

AddType font/ttf .ttf

AddType font/otf .otf

Header set Access-Control-Allow-Origin "*"

然后重启apache

再刷新即可，建议用ctrl+f5刷新页面(清除缓存)。