hexo设置自定义字体粗细

title: hexo设置自定义字体粗细
tags:

折腾
Web

categories:

折腾
Web

date: 2022-07-11 22:58:20

用F12搞了2天终于配置好了自定义字体，这时候就有人要问了，为什么不直接在Butterfly 里设置字体呢？那是因为我设置font-family后找不到我的font-family。只能用 !important 提高优先级来替换字体了。可以参考我的font.css

@font-face {
    font-family:'arzhu';
    src:url('/fonts/FZQiGXKJW.woff2'); /* 修改成你的字体 */
    font-display:swap
}
@font-face {
    font-family: firacode;
    src: url('/fonts/firacoder.woff2');
}
@font-face {
    font-family: fzfonts;
    src: url('/fonts/yuanhua.woff2');
}
h1#site-title {
    font-family:arzhu!important
}
h1.post-title {
    font-family:arzhu!important
}
span#subtitle {
    font-family:arzhu!important
}
a#site-name {
    font-family:arzhu!important;
    font-size: 22px;
}
a.title {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div#post {
    font-family:fzfonts!important;
    font-size: 16px;
    font-weight: bold;
}
div.item-headline {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.author-info__name {
    font-family:arzhu!important;
    font-size: 30px!important;
    font-weight: bold!important;
}
div.footer-wrap {
    font-family:fzfonts!important;
    font-size: 16px;
    font-weight: bold;
}
div#menus {
    font-family:fzfonts!important;
    font-size: 22px;
    font-weight: bold;
}
div#page {
    font-family:fzfonts!important;
    font-size: 16px;
    font-weight: bold;
}
div#tag {
    font-family:fzfonts!important;
    font-size: 16px;
    font-weight: bold;
}
div#archive {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.recent-post-item {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.content {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bolder;
}
div.prev_info {
    font-family:fzfonts!important;
    font-size: 16px!important;
    font-weight: bold!important;
}
div.next_info {
    font-family:fzfonts!important;
    font-size: 16px!important;
    font-weight: bold!important;
}
div#footer-wrap {
    font-family:arzhu!important;
    font-size: 16px;
    font-weight: bold;
}
div#post-meta {
    font-family:arzhu!important;
    font-size: 16px!important;
}
div.pagination {
    font-family:arzhu!important;
}
div.card-widget.card-info {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.aside-list-item {
    font-family:fzfonts!important
}
div.card-widget.card-categories { /*侧边栏分类*/
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.card-tag-cloud {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.webinfo-item {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}
div.search-dialog {
    font-family: fzfonts!important;
    font-size: 16px;
    font-weight: bold;
}
span.line {
    font-family:firacode!important;
}
ul.card-archive-list {
    font-family:fzfonts!important;
    font-size: 14px;
    font-weight: bold;
}

如果不知道对应的是什么可以直接去开发者工具（F12）搜。

如果不想弄可以直接改body

有很多这种包含几乎所有页面的标签，这个时候直接在css里覆盖字体就好了，即可全局改字体，但是因为我用了2中字体，只能挨个改了。