字体在IE中工作，但不是Firefox或Chrome

本文介绍了字体在IE中工作，但不是Firefox或Chrome的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我在我制作的网站中显示的字体有问题。我使用字体ErasITC Light。相关的HTML是：

 < div class =heading> 
< div class =container-fluid> 
< h1>让您的声音听到< / h1> 
< h2>现在是让人们讲话的时候< / h2> 
< / div>

相关的CSS是：

  .heading h1 {
 font-family：ErasITC，Eras Light ITC，sans-serif; 
 color：#ffffff; 
 font-size：6.25vw; 
 font-weight：300; 
 text-shadow：2px 2px 15px black; 
 text-align：center; 
 margin-top：21vh; 
 
} 
 
 .heading h2 {
 font-family：ErasITC，Eras Light ITC，sans-serif; 
 color：#ffffff; 
 font-size：2.7vw; 
 font-weight：300; 
 text-shadow：2px 2px 10px black; 
 text-align：center; 
}

这可以在IE中使用，但不能在Chrome或Firefox中显示默认Sans-Serif字体。

注意：我使用引导程序的一些元素。

Geffen Avraham。

解决方案

如下：

  font-family：Eras ITC，Eras Light ITC ， 无衬线字体;

I am having problem with fonts displaying in a website I am making. I am using the font ErasITC Light. The relevant HTML is:

<div class="heading">
<div class="container-fluid">
    <h1>make your voice heard</h1>
    <h2>it's time to let the people speak out</h2>
</div>

The relevant CSS is:

.heading h1{
font-family: ErasITC, Eras Light ITC, sans-serif;
color: #ffffff;
font-size: 6.25vw;
font-weight: 300;
text-shadow: 2px 2px 15px black;
text-align:center;
margin-top: 21vh;

}

.heading h2{
    font-family: ErasITC, Eras Light ITC, sans-serif;
    color: #ffffff;
    font-size: 2.7vw;
    font-weight: 300;
    text-shadow: 2px 2px 10px black;
    text-align:center;
}

This works in IE, but not in Chrome or Firefox, where it displays a default Sans-Serif font.

NOTE: I am using bootstrap for some elements.

Thanks,

Geffen Avraham.

解决方案

When you are using white-spaces for font names you have to put them in quotes, like so:

font-family: "Eras ITC", "Eras Light ITC", Sans-Serif;

这篇关于字体在IE中工作，但不是Firefox或Chrome的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！