超级简单的问题,我期待。我正在尝试将我的自定义字体上传到服务器,如下所示:
自定义.css.scss
p, ol, li, a, td, ul, h1, h2, h3, h4, h5, h6, label {
font-family: rockwell;
src: url('/assets/Rockwell.TTF');
text-align: left;
em {
font-family: rockwell;
font-style: italic;
src: url('/assets/RockwellItalic.TTF');
}
strong {
font-family: rockwell;
font-weight: bold;
src: url('/assets/RockwellBold.TTF');
}
}
我尝试将这三个 TTF 文件直接放在 app/assets(当前尝试)和 app/assets/stylesheets 中。当我做后者时,我尝试了 src url 作为 /stylesheets/Rockwell.ttf 和 /app/assets/stylesheets/Rockwell.ttf。
这些都没有真正起作用。当我的朋友在他的浏览器中加载网站时,它是另一种字体。知道我做错了什么吗?/ 如何解决?如果这是纯 CSS3,我如何确保我使用的是 CSS3?
编辑——我一直在试图弄清楚应用程序是否无法找到字体文件,所以我检查了检查元素的网络/字体选项卡。无论我是否提供了真实的路径(我错误地尝试过 /stylesheetsRockwell.ttf),都没有出现任何内容。
编辑——用粗体和斜体包装的可能方法?
@font-face {
font-family: 'Rockwell';
src: url('<%= asset_path("Rockwell.ttf") %>');
font-weight: normal;
font-style: normal;
strong {
src: url('<%= asset_path("RockwellBold.ttf") %>');
}
em {
src: url('<%= asset_path("RockwellItalic.ttf") %>');
}
}