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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
@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中字体,只能挨个改了。

This article was written on July 11, 2022.