我正在为网站使用“DinRoundWeb”和“DINRoundComp”字体系列。 CSS 样式表中的声明如下所示:
@font-face {
font-family: Din;
src: url("fonts/DINRoundWeb.eot"), url("fonts/DINRoundWeb.woff") format("woff"), url("fonts/DINRoundComp.ttf") format("truetype");
font-weight: 400;
}
@font-face {
font-family: Din;
src: url("fonts/DINRoundWeb-Medium.eot"), url("fonts/DINRoundWeb- Medium.woff") format("woff"), url("fonts/DINRoundComp-Medium.ttf") format("truetype");
font-weight: 600;
字体文件在字体文件夹中。正文样式如下:
body{
font-family: Din ,sans;
color: #444;
line-height: 1.5rem;
font-size: 1rem;
background-color: #f3f3f3;
}
该样式没有应用到页面中,而且不仅出现在 Web Developer Tools-> Fonts-> All Fonts 下。
如有任何指示,我将不胜感激! 我的风格
最佳答案
从您的 css 文件的 Angular 尝试相对路径。每个字重都需要一个额外的 font-family
,如下所示:
@font-face {
font-family: 'DNRM';
src: url('../fonts/DINRoundWeb-Medium.eot');
src: url('../fonts/DINRoundWeb-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/DINRoundWeb-Medium.woff') format('woff');
}
@font-face {
font-family: 'DNRR';
src: url('../fonts/DINRoundWeb.eot');
src: url('../fonts/DINRoundWeb.eot?#iefix') format('embedded-opentype'), url('../fonts/DINRoundWeb.woff') format('woff');
}
关于html - CSS 字体在 Mozilla Firefox、Microsoft Edge 和 Opera 上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53904225/