CSS 字体系列未加载?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14379788/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 21:21:35  来源:igfitidea点击:

font-family not loading?

css

提问by Mike Earley

I have the following CSS declaration:

我有以下 CSS 声明:

body {font-family: Verdana, Tahoma, "Trebuchet MS", "DejuVu Sans", "Bitstream Vera Sans", sans-serif;

It isn't loading on the page. I'm having to add:

它没有加载到页面上。我必须补充:

    <style>
body {font-family: Verdana, Tahoma, "Trebuchet MS", "DejuVu Sans", "Bitstream Vera Sans", sans-serif;}
</style>

To the HTML to get it to work...This is true in chrome and safari...this one is weird, thoughts?

使用 HTML 使其工作......这在 chrome 和 safari 中是正确的......这个很奇怪,想法?

Note that all other CSS is working correctly...

请注意,所有其他 CSS 都可以正常工作...

采纳答案by Mike Earley

So, !important worked, I'm not sure why. One note, I took out the extra families, it looks like this now:

所以, !important 有效,我不知道为什么。一个笔记,我拿出了额外的家庭,现在看起来像这样:

body, body * {
font-family: Verdana, Tahoma, sans-serif !important;
}

But changing that had nothing to do with fixing it. The !important fixed it. Even though there isn't anything else changing the font-family at any other point in the CSS (refer to the working JS Fiddle). I attached a screenshot of the developer tools to show the inheritance.

但是改变它与修复它无关。!important 修复了它。即使在 CSS 中的任何其他点都没有改变字体系列(请参阅工作 JS Fiddle)。我附上了开发人员工具的屏幕截图以显示继承。

developer tools

开发者工具

回答by algorhythm

have you tried to select following?

您是否尝试选择以下内容?

body, body * {
    font-family: Verdana, Tahoma, "Trebuchet MS", "DejuVu Sans", "Bitstream Vera Sans", sans-serif;
} /* this affects every element in the body and the body itself */

/* OR just */
* {
    font-family: Verdana, Tahoma, "Trebuchet MS", "DejuVu Sans", "Bitstream Vera Sans", sans-serif;
} /* this affects every element */

here is what you can do with CSS3: http://www.css3.info/preview/web-fonts-with-font-face/

这是您可以使用 CSS3 执行的操作:http: //www.css3.info/preview/web-fonts-with-font-face/

回答by Zlatko Soleniq

some font-families have to be enabled using `font-face, usually u do something like this

一些字体系列必须使用`font-face 来启用,通常你会做这样的事情

@font-face {
    font-family: 'alex_brushregular';
    src: url('alexbrush-regular-otf-webfont.eot');
    src: url('alexbrush-regular-otf-webfont.eot?#iefix') format('embedded-opentype'),
         url('alexbrush-regular-otf-webfont.woff') format('woff'),
         url('alexbrush-regular-otf-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

body {

font-family: 'alex_brushregular', Arial, "sans-serif";

}

回答by John Peter

Just try with the following example :

试试下面的例子:

@font-face{font-family:'Arvo';src:url('fonts/Arvo-Regular.ttf')}
@font-face{font-family:'Erasmd';src:url('fonts/ERASMD.TTF')}


body { font-family: Arvo; }

(or)

body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif !important; }

I think this may help you to resolve your problem.

我认为这可以帮助您解决问题。