@font-face存在的问题:
1、不同浏览器支持不同格式
2、Firefox默认情况下不允许跨域font-face,除非你可以添加“Access-Control-Allow-Origin” header to the font.
 
一个暂时的解决方案:
1、去fontsquirrel.com下载需要的font-face kit
2、到fontsquirrel font-face generator上传刚下载的font-face kit
3、选择Expert选项
4、格式选择 ‘TrueType’, ‘EOT’, and ‘SVG’(woff是一种只有Firefox才支持的格式,但是Firefox也支持.ttf,所以就不用woff了)
5、选择‘Base64′  编码
6、下载下来使用就行了
(实际上就是把ttf集合到CSS里,所以可以解决Firefox跨域限制。缺点是CSS文件变大了,对于那些不支持ttf的格式浏览器,像手机Safari和ie)
 
 
这里也有一个办法
# For Apache
<FilesMatch ".(eot|ttf|otf|woff)">
  Header set Access-Control-Allow-Origin "*"
</FilesMatch>
 
# For nginx
location ~* \.(eot|ttf|woff)$ {
  add_header Access-Control-Allow-Origin '*';
}

font-face 在 Firefox无法正常工作问题的更多相关文章

  1. webdriver 操作 Firefox 在关闭浏览器时弹出 “Plugin Container for Firefox已停止工作” 处理办法。

    上来先来一个图: 在使用webdriver操作Firefox浏览器的时候,一路顺畅.可是在最后关闭浏览器后,出现了如上面图示的警告!这个警告很早就出现了,因为也不影响测试结果,也就一直没理. 后来新搭 ...

  2. css3 自定义字体的使用方法

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

  3. 在前端页面中使用@font-face来显示web自定义字体【转】

    本文转自W3CPLUS 的<CSS @font-face> @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现, ...

  4. CSS在线字体库,外部字体的引用方法@font-face

    @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许 ...

  5. css3-自定义字体

    参考链接http://www.w3cplus.com/content/css3-font-face 出处W3CPLUS css3-自定义字体   @font-face @font-face是CSS3中 ...

  6. CSS测试题Ⅱ

    1.如何使用 CSS3 强制换行? A. word-wrap: break-word; B. text-wrap: break-word; C. text-wrap: force; D. text-w ...

  7. 50个jQuery插件可将你的网站带到另一个高度

    Web领域一直在发生变化并且其边界在过去的每一天都在发生变化(甚至不能以小时为计),随着其边界的扩展取得了许多新发展.在这些进步之中,开发者的不断工作创造了更大和更好的脚本,这些脚本以插件方式带来更好 ...

  8. js高级应用

    特别板块:js跨域请求Tomcat6.tomcat7 跨域设置(包含html5 的CORS) 需要下载两个jar文件,cors-filter-1.7.jar,Java-property-utils-1 ...

  9. Jquery打造的类似新浪微博@提醒功能

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. java复习要点(一)------- java语言的特点、java的工作原理、配置环境变量、java命令的使用

    一.java语言的特点: (1)简单并面向对象 (2)鲁棒并安全: java语言在编译及运行程序时,都要进行严格的检查,防止不匹配问题的发生.如果引用一个非法类型,或执行一个非法类型操作,java减肥 ...

  2. const的用法,特别是用在函数前面与后面的区别!

    const的用法,特别是用在函数后面 在普通的非 const成员函数中,this的类型是一个指向类类型的 const指针.可以改变this所指向的值,但不能改变 this所保存的地址. 在 const ...

  3. 风趣的JavaScript面向对象入门课程一

    在我们程序猿界一直流传这这么一个joke,没女票我们可以new一个.没房子没票子没车子我们同样new一个!当然这听着更像是一种自嘲,毕竟我们程序猿都爱自嘲,哈哈,废话不多说,今天就由我带着你们来入Ja ...

  4. IO模型分析

    html { font-family: sans-serif } body { margin: 0 } article,aside,details,figcaption,figure,footer,h ...

  5. Eddy's爱好 hdu2204

    Eddy's爱好 Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  6. 687. Repeats spoj (后缀数组 重复次数最多的连续重复子串)

    687. Repeats Problem code: REPEATS A string s is called an (k,l)-repeat if s is obtained by concaten ...

  7. poj2155一个二维树状数组

                                                                                                         ...

  8. webservice部署到服务器报错

    System.Net.WebException: 基础连接已经关闭: 发送时发生错误. ---> System.IO.IOException: 从传输流收到意外的 EOF 或 0 个字节. 在 ...

  9. C# JAVA成员访问修饰符比较

    在面向对象的访问修饰符中常用的有public ,private ,protected C# 访问修饰符: private < protected internal < internal/p ...

  10. [Unity]Unity3D编辑器插件扩展和组件扩展

    1. 插件扩展 1.1. 命名空间 using UnityEditor; using UnityEngine; //非必需,常用到 1.2. 使用语法 [MenuItem("Assets/M ...