使用@Font-Family 时不显示 TTF 字体答案

【问题标题】：TTF Font not being displayed when using @Font-Family使用@Font-Family 时不显示 TTF 字体
【发布时间】：2015-10-17 16:28:38
【问题描述】：

我正在尝试向使用@Font-Face 制作的网站添加字体，但它不起作用。我完全按照上面的链接做的，但它不起作用。

我的代码：

@font-face {
    font-family: 04B;
    src: url("04b.ttf") format('truetype');
    
}

table {
    margin:auto;
    text-align:center;
	font-size:40px;
    font-family: 04B;
    table-layout: fixed;
    width: 100%;
}

h1 {
	text-align:center;
	font-size:50px;
    font-family: 04B;
}

&lt;h1&gt;Problem is that the font displays exactly like it does in this demo window but shouldnt since I added a font&lt;/h1&gt;

我尝试使用的字体也是我得到的TTF字体from here.该字体也与CSS文件位于同一目录中，所以我认为应该完全没问题

我尝试在 Edge、IE 和 Chrome 中对其进行测试，结果始终如一...

我是不是真的很愚蠢，错过了什么？

【问题讨论】：

你应该做一个合适的工具包 - fontsquirrel.com/tools/webfont-generator
如果你的 css 与你的 html 文件所在的根目录位于不同的目录中，那么试试这个 src：url(../your_css_folder/04b.ttf);没有双引号。 else src: url(../04b.ttf);
CSS 和 HTML 文件在同一目录下。

标签： html css fonts

【解决方案1】：

制作一个像 cmets 中建议的 Pangloss 这样的套件似乎已经修复了它。我仍然不确定我做错了什么，但是按照套件的确切说明可以完美地工作：D

【讨论】：