NexT主题修改背景白色透明度

NexT主题的各版块是纯白色的,这样给站点加上背景特效后,一些板块是不会显示特效的,因为被白色覆盖了,可以通过修改板块的背景样式为透明来让它显示特效。

修改背景图

themes/next/source/css/_custom/custom.styl中添加如下代码:

1
2
3
4
5
6
7
8
9
10
11
body{
background:url(/images/bg4.jpg); //设置背景图
background-size:cover; //规定背景图像的尺寸
background-repeat:repeat;
//设置是否及如何重复背景图像
//repeat是背景图像将在垂直方向和水平方向重复
background-attachment:fixed;
//设置背景图像是否固定或者随着页面的其余部分滚动
//fixed的作用是当页面的其余部分滚动时,背景图像不会移动
background-position:center; //设置背景图像的起始位置
}

各版块透明度修改

内容板块透明

博客根目录themes\next\source\css\_schemes\Pisces\_layout.styl文件.content-wrap标签下background: white修改为:
background: rgba(255,255,255,0.5); //0.5是透明度

菜单栏背景

博客根目录themes\next\source\css\_schemes\Pisces\_layout.styl文件.header-inner标签下background: white修改为:
background: rgba(255,255,255,0.5);

站点概况背景

博客根目录themes\next\source\css\_schemes\Pisces\_sidebar.styl文件.sidebar-inner标签下background: white修改为:
background: rgba(255,255,255,0.5);
然后修改博客根目录themes\next\source\css\_schemes\Pisces\_layout.styl文件.sidebar标签下background: $body-bg-color修改为:
background: rgba(255,255,255,0.5);

按钮背景

博客根目录themes\next\source\css\_common\components\post\post-button.styl同上修改对应位置为background: transparent;

页数导航背景

博客根目录themes\next\source\css\_schemes\Gemini\index.styl搜索pagination,修改此标签下background属性background: rgba(255,255,255,0.5);
如果你使用的是其他的主题,不止需要这样修改,还要修改你使用的主题目录里对应的标签下的属性,例如本站使用Gemini主题,还需要修改themes\next\source\css\_schemes\Gemini\index.styl文件中对应的标签.post-block .comments .pagination的background属性

-------------本文结束感谢您的阅读-------------