Hexo-next主题配置

2020-04-27 12:58:03 阅读：314 来源： 互联网

标签：repeat Hexo 主题 next themes background images banner

修改背景样式

打开文档下themes\next\source\css\ _custom\custom.styl文件，这个是Next故意留给用户自己个性化定制一些样式的文件，添加以下代码：（先在...\themes\next\source\images路径下添加一个背景图片banner.jpg)

// Custom styles.
body {
    background:url(/images/banner.jpg);
    background-repeat: no-repeat;
    background-attachment:fixed;
    background-position:50% 50%;
 background-size: 100% 100%;
}

打开站点配置文件：站点根目录/_config.yml

修改成中文显示和标题名字：（支持的文字类型可以在该主题下\themes\next\languages，language文件夹下查看，简体中文zh-Hans，其它主题可能是zh-CH）

# Site
title: iBoundary
subtitle: ''
description: ''
keywords:
author: iBoundary
language: zh-Hans
timezone: ''

全部代码：（themes\next\source\css\ _custom\custom.styl）

// Custom styles.
//底部字体颜色
.footer-inner {color: #7FFFD4;}
//全局背景图
body {
    //background:url(/images/banner.jpg);
    //background-repeat: no-repeat;
    //background-attachment:fixed;
    //background-position:50% 50%;
    //background-size: 100% 100%;
}
//侧栏背景图和字体颜色
#sidebar {
            background:url(/images/banner.jpg);
            background-size: cover;
            background-position:center;
            background-repeat:no-repeat;
            p,span,a {color: #1C1C1C;}
}
//设置文章边框
.post {
   margin-top: 60px;
   margin-bottom: 60px;
   padding: 25px;
   -webkit-box-shadow: 0 0 5px rgba(202, 203, 203, .5);
   -moz-box-shadow: 0 0 5px rgba(202, 203, 204, .5);
}

修改完上面操作时需要刷新才能生效：

$ hexo clean && hexo g && hexo s
$ hexo d #确认没问题再执行这个

next.config

标签：repeat,Hexo,主题,next,themes,background,images,banner
来源： https://www.cnblogs.com/iBoundary/p/12785526.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

Hexo-next主题配置

修改背景样式