我正在做一些前端项目,但是我遇到了字体问题。在Firefox上可以使用该字体,但在Chrome上则看起来很难看,如Time News Roman。

这是用于将字体导入到我的Sass项目中的代码:

@font-face {
  font-family: 'aHeadline';
  src: local(' Headline'),
  url('../fonts/headline.woff') format('woff'),
  url('../fonts/headline.ttf') format('truetype'),
  url('../fonts/headline.svg') format('svg');
  src: url('../fonts/headline.eot') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}


这是一个现场演示http://185.13.36.42/T/foo.html

注意:字体来自Font Squirrel webfont generator

最佳答案

只是语法上的一点变化。这将为您工作:

@font-face {
    font-family: 'headline';
    src: url('../fonts/headline.eot');
    src: url('../fonts/headline.eot?#iefix') format('embedded-opentype'),
         url('../fonts/headline.woff') format('woff'),
         url('../fonts/headline.ttf') format('truetype'),
         url('../fonts/headline.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;
}

关于css - Font-Face不适用于Chrome,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/21662775/

10-09 08:27
查看更多