hexo给主题next设置背景图片。
首先了解hexo部署在GitHub page上的原理。它将 $HEXO_ROOTDIR/source 目录下的内容编译成静态html页面，因此可以将图片放在新建的picture目录下。
关于theme的背景，则是在 $HEXO_ROOTDIR/$THEME/source 目录下，编辑 /css/_custom/custom.styl 文件，插入以下代码。
然后将所选图片放入images/目录下即可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
35body {
background:url(/images/bz.jpg);// 设定背景图片,images同处于theme/source文件夹下
background-repeat: no-repeat;// 设定背景图片非重复填充
background-attachment:fixed;// 设置背景图片不随页面滚动
background-position:50% 50%;// 设置背景图片位置
background-size: cover// 设置保持图像的纵横比并将图像缩放成将完全覆盖背景定位区域的最小大小
}
// 页面头样式属性
.header-inner {
// 也可以同时定义背景色
// background: #ddd
// 透明度
// opacity: 0.8;
}
// sidebar侧边工具栏样式属性
.sidebar{
// 动画过渡时间
transition-duration: 0.4s;
// 透明度
opacity: 0.8
}
// 标题样式
.posts-expand .post-title-link {
// 设置字体颜色
color: #222;
}
// 文章版块样式
.post-block {
//background: var(--content-bg-color);
background: #fff
border-radius: initial;
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.06), 0 1px 5px 0 rgba(0,0,0,0.12);
padding: 40px;
}
最后重新部署一遍1
hexo clean && hexo generate && hexo deploy