修改博客中导航栏的颜色与字体
Hexo博客默认主题landscape中的导航栏字体太小，背景色太单调，如果想设置该怎么办呢？本文将详述导航栏颜色与字体的设置。
打开\blog\themes\landscape\source\css_partial目录下的header.styl 文件，做如下设置：
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
| #header
height: banner-height
position: relative
border-bottom: 1px solid color-border
&:before, &:after
content: ""
position: absolute
left: 0
right: 0
height: 55px #此处有修改，更改导航栏高度，默认40px
&:before
top: 0
background: linear-gradient(red, transparent)
#此处有修改，更改导航栏渐变颜色，默认linear-gradient(rgba(0, 0, 0, 0.2), transparent)
#main-nav
float: left
font-size: 18px
#此处有添加，更改导航栏字体的大小，默认font-size=14px
.nav-icon
@extend $nav-link
font-family: font-icon
text-align: center
font-size: 18px #更改导航栏图标的大小，默认font-size=font-size
|
按照代码中注释所述按需进行修改即可。
版权声明
Scholar’s Blog by scholargeek is licensed under a Creative Commons BY-NC-ND 4.0 International License.
由董仕麟创作并维护的scholargeek博客采用创作共用保留署名-非商业-禁止演绎4.0国际许可证。
本文首发于Scholar’s Blog博客，版权所有，侵权必究。
本文永久链接：https://scholargeek.github.io/2019/07/28/Hexo%E5%8D%9A%E5%AE%A2%E9%BB%98%E8%AE%A4%E4%B8%BB%E9%A2%98%E7%9A%84%E4%BF%AE%E6%94%B9%E4%B8%8E%E7%BE%8E%E5%8C%9614/