html - ubuntu 中的 css @font-face 不起作用

标签 html css linux font-face

我在 Windows 下开发网页。它有这样的文件夹:

wwwroot
wwwroot/css
wwwroot/fonts

和文件

wwwroot/css/main.css
wwwroot/fonts/fontaaa.otf

main.css文件有这样一段代码:

@font-face
{
    font-family : 'fontaaa';
    src         : url("../fonts/fontaaa.otf");
}

它在我的本地主机上看到 Windows 下的字体。 一切都很完美,所以我将我的元素上传到linux服务器。 一切正常(页面加载、样式正常),但字体 fontaaa.otf 未显示。问题是什么?花了很多时间弄清楚。

附言我以前从未使用过@font-face

附言字体是从 Internet 下载的(不在 Windows 字体文件夹中)。

最佳答案

字体声明如下:

@font-face {
  font-family: 'Font name';
  font-style: normal;
  font-weight: 400;
  src: local('Font name'), local('Font name-Regular'), url(fontname.woff) format('woff');
}

要应用这些字体,您必须这样做:

<style>
h1 {
font-family: 'Font Name', Arial/* Just in case if your web fonts didn't load */;
}
</style>

<h1>this will be font-face fonts</h1>

更多web fonts

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

相关文章:

javascript - 为什么会出现这种计算差异?查询

javascript - 如何在 HTML 代码中生成 PDF(javascript : jspdf, downloadify??)

css - 通过 JavaScript 动态设置 CSS3

css - 具有奇数像素图像比例的 Div?

html - 如何给边框半径使元素看起来像这个图像?

linux - 在几分钟内解析/格式化 ps -eo etime?

协同内核开发

javascript - 不提交表单的 HTML 按钮

javascript - 如何获取一系列数字之间的 div 元素?

linux - 在shell脚本中对时间格式进行排序