使用@ font-face和.ttf文件时遇到问题 [英] Trouble with @font-face and .ttf file
问题描述
我想使用@ font-face来实现我在线下载的字体（ http ：//www.losttype.com/font/？name = blanch ），我在使用任何浏览器工作时遇到问题。下面是我用来测试字体的示例代码。
I'm trying to use @font-face to implement a font I downloaded online (http://www.losttype.com/font/?name=blanch) and I'm having issues getting it to work on any browser. Here's the sample code I'm using to test the font.
<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文件。有人可以解释为什么这不工作吗？
I only have the .ttf file. Can someone explain why this isn't working?
推荐答案
在结构 url（'BLANCH_CONDENSED.ttf '），'smart'单引号必须替换为Ascii引号（单引号或双引号），例如 url（'BLANCH_CONDENSED.ttf'）。
In the construct url(‘BLANCH_CONDENSED.ttf’), the ‘smart’ single quotes must be replaced by Ascii quotes (single or double), e.g. url('BLANCH_CONDENSED.ttf').
您还应使用 FontSquirrel webfont generator 或一些类似的工具来生成不同的字体格式覆盖所有浏览器。
You should also use FontSquirrel webfont generator or some similar tool to generate different font formats to cover all browsers.
这篇关于使用@ font-face和.ttf文件时遇到问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
