字体在Chrome

Question

我的wordpress主题中的style.css中有以下字体。

@font-face {
    font-family: 'latoregular';    
    src: url('./fonts/lato-regular.eot');
    src: url('./fonts/lato-regular.eot?#iefix') format('embedded-opentype'),
    url('./fonts/lato-regular.woff2') format('woff2'),
    url('./fonts/lato-regular.woff') format('woff'),
    url('./fonts/lato-regular.ttf') format('truetype'),
    url('./fonts/lato-regular.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'bebasregular';
    src: url('./fonts/bebas___-webfont.eot'); 
    src: url('./fonts/bebas___-webfont.eot?#iefix') format('embedded-opentype'),
    url('./fonts/bebas___-webfont.woff2') format('woff2'),
    url('./fonts/bebas___-webfont.woff') format('woff'),
    url('./fonts/bebas___-webfont.ttf') format('truetype'),
    url('./fonts/bebas___-webfont.svg#bebasregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'coustardregular';
    src: url('./fonts/coustard-regular.eot');
    src: url('./fonts/coustard-regular.eot?#iefix') format('embedded-opentype'),
    url('./fonts/coustard-regular.woff2') format('woff2'),
    url('./fonts/coustard-regular.woff') format('woff'),
    url('./fonts/coustard-regular.ttf') format('truetype'),
    url('./fonts/coustard-regular.svg#coustardregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

这是h2元素

中的文字

h2元素的font-family为coustardregular，font-weight为bold。正如您在图像中看到的那样，字母T的结构非常奇怪，字母I也是如此。我只在chrome中遇到此问题而在其他任何地方都没有。我也尝试了this链接，但它不起作用，我不知道它。任何人都可以指导我这个。

Answer 1

您从哪里获取字体文件？我通常会尝试坚持使用谷歌字体，而不是使用大量的文件，因为你知道它们会在尝试和测试时起作用，而很多时候当你使用单个文件时，它们已经从另一个文件中转换文件类型，这是很多问题的来源。

Google字体具有Coustard字体，只需将以下内容添加到您的css文件（顶部）即可使用它：

@import url(https://fonts.googleapis.com/css?family=Coustard);

...或转到Google进行自定义 - https://www.google.com/fonts/specimen/Coustard