html设置的css字体在浏览器不生效

1,260 阅读1分钟

为什么设置了浏览器的字体却无法对所有网页起作用?

你只需要将你网页中用到的字体放置到你的文件夹里面向引用图片一样去引用就就可以将字体加载进去,然后在设置字体类型的时候调用你设置的名字即可

image.png

  1. 在你的src文件下的静态目录assets里添加css文件夹和font文件夹
  2. 在font文件下存储你下载下来的需要用的字体 .ttf尾缀

image.png

  1. 在css文件夹里新建font.css文件,放入你引入的字体文件
 @font-face {
    font-family: "Graphik";
    src: url("../font/Graphik-Regular.ttf");
    font-weight: normal;
    font-style: normal;
  }
  @font-face {
    font-family: "STIXGeneral";
    src: url("../font/STIXGeneral-Regular.ttf");
    font-weight: normal;
    font-style: normal;
}

然后在引用的时候正常引用就可以啦~

image.png