2013-05-26 81 views
1

由于某种原因,我使用Micra的字体没有出现在所有浏览器上。它适用于我所有的浏览器,而不是在其他人的浏览器上测试。难道我做错了什么。字体没有显示在所有浏览器(micra字体)

#nav { 
position: fixed; 
top:55px; 
left: 86px; 
min-width:690px; 
white-space:nowrap; 
text-align:left; 
padding:0 0 34px 333px; 
z-index:99; 
} 

#nav a {  
font-family: Micra, serif; 
color: #FFF; 
font-style:normal; 
font-weight:400; 
text-decoration:none; 
font-size:90%; 
margin:0 55px 0 0; 
} 
+1

使用font-face包含字体 –

+0

另请参阅Web字体http://www.google.com/fonts/ – ninMonkey

+0

字体只安装在您的PC而不安装在其他人中,这是它不工作的方式。 –

回答

7

这是因为他们没有安装该字体。

如果你有一个许可证嵌入字体,你可以按照如下

@font-face 
{ 
font-family: myFirstFont; 
src: url(sansation_bold.woff); 
font-weight:bold; 
} 

看到这个question更详细的如何,包括它在你的CSS文件。

更新这里是一个不错的list of free fonts that你可以嵌入到你的网站。

+1

我试图寻找字体的许可证,但找不到一个 – gVidal

+0

我找不到任何地方只能购买免费下载,嵌入它自行承担风险。 +阅读我最近的更新。如果你喜欢它,不要忘记接受我的答案。 – Aviatrix

2

是否在每台正在测试的计算机上安装字体?

如果没有安装Micra字体(并且它听起来并不熟悉,所以我认为它不是),浏览器将回退到缺省衬线字体。

2

使用字体家族

的font-family属性应该持有多种字体的名称为 “回退” 系统。如果浏览器不支持第一个字体,它会尝试下一个字体。

所以你使用像

p{font-family:"Times New Roman", Times, serif;} 

否则,您可以使用的字体即使其它计算机不必须安装计算机上安装新字体像下面

@font-face { 
    font-family: Micra; 
    src: url('Micra.otf'); 
} 

阅读here

+0

所以用@ font-face {font-family:Micra; src:url('Micra.otf'); }它'加载字体给某些浏览器? – gVidal

6

试试这个例子: -

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet'   

type='text/css'> 

访问此link

请参阅概览部分。