html - 呈现的字体与字体系列不同

Question

我有一个 DIN Regular True Type 字体，我像这样导入和声明:

@font-face {
  font-family: 'DINRegular';
  src: url('../fonts/DINBek-Regular.ttf')  format('truetype'), 
}

body {
    font-family: 'DINRegular', Tahoma, Geneva, sans-serif;
}

但是，我的网站上有一个 Accordion ，它总是返回 Times New Roman。代码检查器中的字体系列是“DINRegular”，但“计算”选项卡上呈现的字体显示字体是 Times New Roman。有什么解决办法吗？

Answer 1

format('truetype') 后有一个逗号 - 删除并添加一个分号

format('truetype');

同时从 body 中的字体系列声明中删除引号，这样它就是

font-family: DINRegular, Tahoma, Geneva, sans-serif;

此外，如果您的浏览器不支持 .ttf，这里有一个更完整的字体声明示例:

@font-face {
font-family: 'myfont';
src: url('myfont.eot');
src: url('myfont.eot?#iefix') format('embedded-opentype'),
     url('myfont.woff2') format('woff2'),
     url('myfont.woff') format('woff'),
     url('myfont.ttf') format('truetype'),
     url('myfont.svg#myfont') format('svg');
}

添加其他格式后