时间：2023-07-26 02:39:01 | 来源：网站运营
时间：2023-07-26 02:39:01 来源：网站运营
一个基于 html5 canvas 绘制的网页背景效果：一个基于 html5 canvas 绘制的网页背景效果。
在线咨询
# 使用 npmnpm install --save canvas-nest.js# 或者使用 yarnyarn add canvas-nest.js<body> 和 </body> 之间.<script type="text/javascript" src="dist/canvas-nest.js"></script>强烈建议在 </body>标签上方. 例如下面的代码结构:<html><head> ...</head><body> ... ... <script type="text/javascript" src="dist/canvas-nest.js"></script></body></html>然后就完成了，打开网页即可看到效果!请注意不要将代码置于 <head> </head>里面.import CanvasNest from 'canvas-nest.js';const config = { color: '255,0,0', count: 88,};// 在 element 地方使用 config 渲染效果const cn = new CanvasNest(element, config);// destroycn.destroy();color: 线条颜色, 默认: '0,0,0' ；三个数字分别为(R,G,B)，注意用,分割opacity: 线条透明度（0~1）, 默认: 0.5count: 线条的总数量, 默认: 150zIndex: 背景的z-index属性，css属性用于控制所在层的位置, 默认: -1<script type="text/javascript" color="0,0,255" opacity='0.7' zIndex="-2" count="99" src="dist/canvas-nest.js"></script>{ color: '0,0,255', opacity: 0.7, zIndex: -2, count: 99,};注意: 所有的配置项都有默认值，如果你不知道怎么设置，可以先不设置这些配置项，就使用默认值看看效果也可以的。canvas-nest 即可安装。关键词：背景,效果,绘制
