html - @font-face 帮助它不起作用

标签 html css fonts font-face

我创建了这个测试文件

<h1> test <h1>

然后在 CSS3 中,我这样做了

@font-face {
font-family: 'hello';
src:url('/fonts/HelloStockholm-Alt.otf')
font-style: normal;
font-weight: 100;
} 

h1 {
font-family: hello;
font-weight: 100;
}

这是我下载的字体

https://www.dafont.com/de/hello-stockholm.font

希望大家能帮帮我

最佳答案

你忘了在代码末尾写;

src:url('/fonts/HelloStockholm-Alt.otf');

更新

好的。我找到了正确的答案。我在本地制作了你的小元素并下载了字体。它不是.otf 文件,它是.ttf 文件。 您只需将类型 .otf 更改为 .ttf

此外,如果您的 html 不在字体文件夹中,则从字体源中删除 /。也许你在我下载时重命名了字体文件,名称是这样的 HelloStockholm-Regular

src:url('fonts/HelloStockholm-Regular.ttf');

最后你忘了在这里关闭 h1 ;)

<h1> test </h1>

希望对您有所帮助。祝你好运!)

关于html - @font-face 帮助它不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47797357/

相关文章:

html - 根据状态更改按钮颜色

CSS- Family-font 用于单行和多行文本控制

css - 如何在 HTML 中显示反向排序列表?

html - CSS 显示内联 block 如何防止重排?

html - 使用 CSS 剪辑后,我可以移动图像以显示不同的部分吗?

html - 如何将自定义字体添加到 ConvertTo-HTML 的 <head> 部分?

html - 如何使用CSS在一段中添加多种字体?

html - 通过隐藏的溢出保持图像水平流动

javascript - 在 HTML canvas 中使用鼠标控制游戏

javascript - jQuery PHP 将重复的行折叠成一个