链接到相关网站：http://qbtei.com/nationalretail/public

在我的fonts.css中,我正在加载一堆字体,如下所示：

@font-face {
    font-family: GothamBook;
src: url('../fonts/Gotham-Book.otf');
src: url( ../fonts/Gotham-Book.otf ); /* IE */
    }

@font-face {
    font-family: GothamBookItalic;
src: url('../fonts/gothambookitalic.otf');
src: url( ../fonts/gothambookitalic.otf ); /* IE */
    }

@font-face {
    font-family: GothamBold;
    src: url('../fonts/gothambold.otf');
    src: url( ../fonts/gothambold.otf ); /* IE */
}

在Firefox / chrome这些字体没有问题,但在IE 10中,当我检查元素时,这个css文件显示为空并且字体未加载

我尝试使用http://www.fontsquirrel.com/tools/webfont-generator创建一个新的字体css表,看起来像这样,但这最终无法在firefox,chrome或Internet Explorer中工作

@font-face {
    font-family: 'gotham_boldregular';
    src: url('gothambold-webfont.eot');
    src: url('gothambold-webfont.eot?#iefix') format('embedded-opentype'),url('gothambold-webfont.woff') format('woff'),url('gothambold-webfont.ttf') format('truetype'),url('gothambold-webfont.svg#gotham_boldregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

我在css中使用我的字体,如下所示：

.nav-text{
    font-family: GothamLight;
    font-size: 21px;
    color: #d9e3e9;
    font-weight: 100;
    position: absolute;
  right: 28px;
  top: 13px;
}