CSS：后备字体
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4673963/
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
CSS: Fallback fonts
提问by lemon
My website uses a rather obscure font that about half the computers can properly read. The font is "Lucida Console". On the computers that can't read this font, they get displayed ugly Times New Roman, is there a way to set the font of my website to Lucida Console but on computers that can't read it, view Arial instead? Using CSS.
我的网站使用了一种相当晦涩的字体，大约有一半的计算机可以正确阅读。字体是“Lucida Console”。在无法读取此字体的计算机上，它们显示为丑陋的 Times New Roman，有没有办法将我的网站字体设置为 Lucida Console，但在无法读取它的计算机上，改为查看 Arial？使用 CSS。
回答by Jaxan
you can specify multiple fonts:
您可以指定多种字体：
p{font-family:"Times New Roman", Times, serif;}
The browser will try the first one, if that one isn't available the second, and so forth. In the end it uses the family serif, so the browser choses any serif font. You should use the monospace family.
浏览器将尝试第一个，如果第二个不可用，依此类推。最后它使用了系列衬线，因此浏览器选择了任何衬线字体。您应该使用等宽系列。
So in your case, somthing like this is what you want:
所以在你的情况下，像这样的事情就是你想要的：
p{font-family:"Lucida Console", "Courier New", monospace;}
回答by Basil Bourque
Further tips:
更多提示：
- Google css font stackfor suggested lists of fonts aimed at certain styles of fonts. 'font stack' is the colloquial name for these font lists.
- Think cross-platform. Consider adding fonts commonly found on Mac, Linux, iOS, Android, Windows, and other platforms your readers may be using.
- Always include a generic-familyname at the end of your font stack in case the user has none of your desired fonts:
- serif
- sans-serif
- cursive
- fantasy
- monospace
- Include quotes around fonts named with multiple words, or simply quote all font names.
回答by kapa
You can also serve that obscure font with your website (if you are legally able to) using @font-face. It's easy and works even in IE6 :).
您还可以使用@font-face 在您的网站上提供这种晦涩的字体（如果您有法律能力的话）。它很简单，甚至在 IE6 中也能工作:)。
Read about it here: http://www.miltonbayer.com/font-face/
