我正在做一些前端项目,但是我遇到了字体问题。在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/