我正在尝试使用 @font-face 来实现我在线下载的字体(http://www.losttype.com/font/?name=blanch http://www.losttype.com/font/?name=blanch)并且我在让它在任何浏览器上工作时遇到问题。这是我用来测试字体的示例代码。
<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<div class = "title">
<p>THE QUICK BROWN FOX JUMPS OVER THE LAZY DOG</p>
</div>
</body>
</html>
css文件是:
@font-face {
font-family: Blanch;
src: url(‘BLANCH_CONDENSED.ttf’);
}
.title {
text-align:center;
font-family: Blanch, 'Helvetica Neue', Arial, Helvetica, sans-serif;
color:white;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
我只有 .ttf 文件。有人可以解释为什么这不起作用吗?
在构造中url(‘BLANCH_CONDENSED.ttf’)
,“智能”单引号必须替换为 Ascii 引号(单引号或双引号),例如url('BLANCH_CONDENSED.ttf')
.
您还应该使用FontSquirrel 网页字体生成器 http://www.fontsquirrel.com/tools/webfont-generator或一些类似的工具来生成不同的字体格式以覆盖所有浏览器。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)