51工具盒子

依楼听风雨
笑看云卷云舒,淡观潮起潮落

Hexo增加动态线条效果背景

前言 {#前言}

效果如本站所示,我看过一些博客,有很多一部分都有这个动线效果背景。

操作 {#操作}

操作步骤很简单,只需在_config.butterfly.yml文件中,找到inject,在bottom处直接引入:https://cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js

|-----------|------------------------------------------------------------------------------------------------------------| | 1 | - <script src="https://cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js"></script> # 背景动态线条 |

或者直接修改_config.butterfly.yml配置文件中的canvas_nest配置

|---------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 | # canvas_nest # https://github.com/hustcc/canvas-nest.js canvas_nest: enable: true color: '0,0,255' #color of lines, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.) opacity: 0.7 # the opacity of line (0~1), default: 0.5. zIndex: -1 # z-index property of the background, default: -1. count: 99 # the number of lines, default: 99. mobile: false |

重新部署之后就可以看到效果啦:)

结尾 {#结尾}

非常感谢并敬佩各位大佬的操作,让我可以如此轻松的DIY。

赞(1)
未经允许不得转载:工具盒子 » Hexo增加动态线条效果背景