html – 渲染字体与字体系列不同

2023年8月6日 215次阅读

我有一个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;
}

但是,我的网站上有一支手风琴,总是回归Times New Roman.代码检查器中的字体系列是“DINRegular”,但“Computed”选项卡上的呈现字体表示字体是Times New Roman.任何想法如何解决？

最佳答案 格式后有一个逗号(‘truetype’) – 删除并添加一个半冒号

format('truetype');

同时从正文中的字体系列声明中删除引号

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');
}

添加其他格式后

点赞