WordPress的字体跨浏览器问题

Question

我建立一个WordPress网站。我选择菜单栏的字体。 但问题是，这个字体只显示Google chrome &它没有显示在IE和Mozilla（FireFox）中。

请帮我

This is my font

#nav ul li a:hover, 
#nav .current-menu-item > a, 
#nav .current-menu-ancestor > a, 
div#nav ul .current_page_item > a { 
    color: #9A6614; 
} 

#nav > ul li, 
#nav .menu > ul li { 
    padding: 8px 0; 
} 

#nav > ul li a, 
#nav .menu > ul li a { 
    padding: 0 25px 0 25px; 
    font-size:17px; 
    border-left: 1px solid #CFCFCF; 
    font-family:"LovePotionNo10Bold" !important; 
} 

#nav ul li:first-child a{ 
    font-family:LovePotionNo10Bold !important; 
    border-left: 0px; 
} 

以下是我的头文件中的声明

@font-face { 
font-family: 'LovePotionNo10';src: url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_0_0.eot'); 
src: url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_0_0.eot? #iefix') format('embedded-opentype'), 
url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_0_0.woff') format('woff'), 
url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_0_0.ttf') format('truetype'); 
} 

@font-face { 
font-family: 'LovePotionNo10Bold'; 
src: url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_1_0.eot'); 
src: url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_1_0.eot?#iefix') format('embedded-opentype'), 
url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_1_0.woff') format('woff'), 
url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_1_0.ttf') format('truetype'); 
} 

@font-face { 
font-family: 'LovePotionNoOrnaments'; 
src: url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_2_0.eot'); 
src: url('webfonts/22418E_2_0.eot?#iefix') format('embedded-opentype'), 
url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_2_0.woff') format('woff'), 
url('http://comidaslacocotte.com/wp-content/themes/maya/webfonts/22418E_2_0.ttf') format('truetype'); 
} 

Answer 1

阅读这篇文章：http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/

使用@font-face人绝对必不可少的读物。建议的语法是：

@font-face { 
    font-family: 'Graublau Web'; 
    src: url('GraublauWeb.eot?') format('eot'), 
     url('GraublauWeb.woff') format('woff'), 
     url('GraublauWeb.ttf') format('truetype'); 
} 

Answer 2

我看到你的代码一个错字，不知道这是否会解决您的问题：

#nav ul li:first-child a{ 
    font-family: 'LovePotionNo10Bold' !important; 
    border-left: 0px; 
} 

需要在字体声明周围加引号，单打或双打。

仅供参考：我会建议放弃！重要规则。