导入字体后是否需要@ font-face指令?

时间:2014-10-31 09:37:56

标签: css font-face webfonts

我正在使用商业wordpress主题和redux框架的网站上工作。在我看来,Web字体的实现方式不正确,我只想与前端专家确认一下。

在包含的css文件中声明以下内容:

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:600);

稍后,该字体在整个主题的css中使用:

font-family: Source Sans Pro;

经过一些测试后,在我看来,只有最终用户实际上在他们的系统上安装了Source Sans Pro字体时才能使用上述功能。在我的情况下,我确实在OSX上安装了这个,因此没有看到与最终用户相同的字体问题。由于没有提供后备,我观察到在其他浏览器中,例如IE11在虚拟化Windows 8.1上显示serif字体。

导入后是否需要Source Sans Pro的@ font-face声明?我无法在主题加载的css中找到它。 Source Sans pro也应该被引用吗?以下是否更正确?

font-family: "Source Sans Pro", sans-serif;

2 个答案:

答案 0 :(得分:0)

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:600);
font-family: 'Source Sans Pro', sans-serif;

在Google上找到它:fonts library

我刚测试过它,没有引号和sans-serif部分就可以正常工作。所以你可以肯定它有效:)

答案 1 :(得分:0)

我意识到如果你按照链接http://fonts.googleapis.com/css?family=Source+Sans+Pro:600加载包含@ font-face代码的css。