suyc's blog

哎,什么时候才能把英语学好啊🙇‍~

Next 7.X 添加背景

Next 7.X (主要是7.2.0)添加背景跟以前的版本有了很大的变化,网上很多方法都是旧版Next的,下边是我自己尝试出来的方法:
路径:themes\next\source\css\_common\scaffolding\base.styl

修改其中的body,把background字段覆盖:

1
2
3
4
5
6
// background: $body-bg-color;
background: url(/images/XXX.jpg);
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;

然后如果想让前边的页面虚化一些可以在最后直接添加:
1
2
3
.main-inner {
opacity: 0.9;
}

最后剩下的一部分就不要虚化了,因为会导致搜索框太浅,无法使用。

如果不添加背景,可以直接给背景改个颜色,我这里最后还是采取了直接改颜色的办法,可以看到背景颜色是由$body-bg-color决定的,可以在当前主题中搜索这个关键词,例如我这个主题是Pisces,所以我的路径是在themes\next\source\css\_variables\Pisces.styl里,直接把这一项的颜色改一下就行,我改成了#f2f3f4,就是灰的颜色重了一点,可能也看不出啥变化~