背景:在内部网络应用中,我使用的是Google字体Open Sans。我已经下载了字体文件并与应用程序捆绑在一起(应用程序必须脱机工作)。最近我注意到Google有一个较新版本的字体,此时我重新下载并在应用程序中更新了它。此时我还改变了我在CSS中包含字体的方式,将其删除为仅使用.woff和.woff2格式(仅需要支持IE11和Chrome)
问题:由于我们测试服务器上自己的计算机上的此更新,仅在IE中,所有文本都显示为粗体。在Chrome中它很好。在IE中使用localhost在我的本地副本中查看它时,字体工作正常。在其他计算机上它一直工作正常。到目前为止,我只看到另一台计算机有同样的问题。
如果我检查元素,则将其正确设置为使用font-weight: 400
并正确使用.woff文件用于IE11。它似乎只是使用粗体版本的字体而不是常规版本。
我担心这会发生在我客户的电脑上,因为我知道它不仅仅是我的电脑。
代码:以下是我用来导入字体的代码。我和之前的唯一区别是我不再导入SVG和其他格式。
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'), url(../assets/fonts/OpenSans/OpenSans-Regular.woff2?v=1.5.0) format('woff2'), url(../assets/fonts/OpenSans/OpenSans-Regular.woff?v=1.5.0) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'), url(../assets/fonts/OpenSans/OpenSans-SemiBold.woff2?v=1.5.0) format('woff2'), url(../assets/fonts/OpenSans/OpenSans-SemiBold.woff?v=1.5.0) format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: local('Open Sans Bold'), local('OpenSans-Bold'), url(../assets/fonts/OpenSans/OpenSans-Bold.woff2?v=1.5.0) format('woff2'), url(../assets/fonts/OpenSans/OpenSans-Bold.woff?v=1.5.0) format('woff');
}
更多细节: Web应用程序使用Angular 5(使用Angular CLI),SASS,并通过Tomkins Windows服务器上的Jenkins部署。测试服务器当前正在开发模式下运行。
我已经尝试清除浏览器中的所有缓存并多次重新启动计算机,但没有任何修复它。
我很遗憾无法链接到应用,因为它只是内置的。
以下是在测试服务器上以及在localhost上查看时的差异的屏幕截图:
我认为这可能是许多事情的结果,所以如果我需要提供更多信息,请告诉我。