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
font-family not loading?
提问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)。我附上了开发人员工具的屏幕截图以显示继承。
回答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.
我认为这可以帮助您解决问题。