QQ爹の博客 QQ爹の博客

如何妥善的设置网页的字体

in 实用技巧 read (432) 237汉字 文章转载请注明来源!

在写模板时很纠结字体怎么写,于是找了几个网站抄了下字体配置。但是这个问题还是困扰我心!

就在昨天突然看到github上的一个项目,这个项目就是简单粗暴的办法就是把各个平台的安全字体提取出来,用优先级搞一下。

项目地址:https://github.com/zenozeng/fonts.css
DEMO:https://zenozeng.github.io/fonts.css/

这个项目罗列了三种字体:黑体,楷体,宋体

使用方法,以楷体为例

<head>
    <link rel="stylesheet" type="text/css" href="fonts.css" />
</head>
<body>
    <p class="font-kai">
        故天将降大任于是人也必先苦其心智劳其筋骨饿其体肤空乏其身行弗乱其所为所以动心忍性曾益其所不能
    </p>
</body>

也可以简单粗暴的把它里面的字体配置复制出来,放到自己的css的body中,下面以黑体为例

body{
font-family: -apple-system, "Helvetica Neue", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans", "PingFang SC", "Hiragino Sans GB", "Source Han Sans CN", "Source Han Sans SC", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti", SimHei, "WenQuanYi Zen Hei Sharp", sans-serif;
}

这个项目也许看似闲的蛋疼,但是程序员也许就是有着这样的奇怪强迫症的一群人吧?

jrotty WeChat Pay

微信打赏

jrotty Alipay

支付宝打赏

文章二维码

扫描二维码,在手机上阅读!

前端字体
最后由Jrotty编辑于2017-07-27 13:42
发表新评论
已有 8 条评论
  1. Tokin
    Tokin
    回复

    然并卵,网页做多了,自然会有自己的一套css格式化代码。。。

    1. Jrotty
      Jrotty本文作者
      回复

      @Tokin 然而对于我这样没做多的人来说,这个很有用的

      1. 香菇
        香菇
        回复

        @Jrotty 为什么我没有。。

        1. Jrotty
          Jrotty本文作者
          回复

          @香菇 无他,唯手熟尔

  2. Ice-Hazymoon
    Ice-Hazymoon
    回复

    哇,最近突然开始高产

    1. Jrotty
      Jrotty本文作者
      回复

      @Ice-Hazymoon 因为技能冷却时间过来哈哈哈

  3. c0smxsec
    c0smxsec
    回复

    苟利国家生死以,岂因祸福避趋之。

    1. Jrotty
      Jrotty本文作者
      回复

      @c0smxsec 评论区不养狗

前篇 后篇
雷姆
拉姆
音乐加载中...
0:00