Question

我正在使用google webfonts帮助器为我的字体生成css，然后下载字体文件：https://google-webfonts-helper.herokuapp.com

我生成了以下内容：

@font-face {
 font-family: 'Lato';
font-style: normal;
font-weight: 400;
src: local('Lato Regular'), local('Lato-Regular'),
      url('../Content/fonts/lato-v11-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
   url('../Content/fonts/lato-v11-latin-regular.woff') format('woff'); /*   Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

我的字体文件存储在〜/ Content / fonts

中

我引用了这样的字体：

body {
font-family: 'Lato', sans-serif;
margin-bottom: 90px;
font-weight: 500;

}

然而，似乎无论我做什么，我都无法让字体正常工作。我在chrome中检查了计算字体系列，并将其设置为Lato。它也不适用于任何其他浏览器。

Answer 1

我认为您的网址不正确。

url('../Content/fonts/lato-v11-latin-regular.woff2')

这意味着，无论您的CSS文件位于何处，请返回一个目录，然后转到foler Content/fonts，但如果您的字体存储在~/Content/fonts并且你的CSS存储在两个子文件夹中，例如例如/~/assets/css/mycssFile.css您的网址无效。

您可以尝试url('/Content/fonts/lato-v11-latin-regular.woff2')使用您网站的根目录，或者更好，您可以尝试：
url('/../Content/fonts/lato-v11-latin-regular.woff2')将告诉根目录，和尝试再返回一个文件夹，这应该保证你获得根目录。如果这些都没有解决您的问题，那么问题不在于URL，而在于其他问题。

无法使字体与@ font-face一起使用

1 个答案: