基于Hexo的个人博客站点高级自定义设置——使用NexT主题

发表于 2020-05-02
分类于建站 Valine：

通过自定义CSS样式，可以打造出炫酷的个人博客站点。

在此前的两篇文章《使用Hexo + GitHub Pages搭建个人博客站点》和《将Hexo搭建的博客站点从GitHub Pages迁移到腾讯云VPS》中，我们分别讲述了如何通过Hexo + NexT主题搭建炫酷的个人博客站点，并通过将站点由GitHub Pages迁移至腾讯云VPS来提升访问速度。本文以此为基础，通过对CSS样式的深度定制，实现了Hexo NexT主题Mist风格视觉感受的提升，最终呈现出你所看到的样子。

对CSS样式的自定义依赖hexo/source/_data/styles.styl文件，需要开启hexo/themes/next/_config.xml中custom_file_path的相关选项，默认是注释掉的

1 2	custom_file_path: style: source/_data/styles.styl

styles.styl中的CSS样式编辑用到了一些前端知识，点击这里下载我的styles.styl文件，要善用浏览器的F12快捷键进行调试才能达到理想效果，遇到不懂的样式通过网络获取相关知识。