美化——看板娘
看板娘
感觉博客园的模板有点单调，自己找了一些方法添加一些人物---看板娘，效果还行，就记录一下
1.下载相关文件
解压就是这些
2.将文件上传到博客园
- waifu.css
- waifu-tips.js
- live2d.js
3.实现代码
把代码放到脚本HTML代码处
1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 5 <title>Live2D</title> 6 7 <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/lanyincao/waifu.css"/> 8 <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> 9 </head> 10 <body> 11 <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/lanyincao/waifu.css"> 12 13 14 <div class="waifu" id="waifu"> 15 <div class="waifu-tips" style="opacity: 1;"></div> 16 <canvas id="live2d" width="280" height="250" class="live2d"></canvas> 17 <div class="waifu-tool"> 18 <span class="fui-home"></span> 19 <span class="fui-chat"></span> 20 <span class="fui-eye"></span> 21 <span class="fui-user"></span> 22 <span class="fui-photo"></span> 23 <span class="fui-info-circle"></span> 24 <span class="fui-cross"></span> 25 </div> 26 </div> 27 <script src="https://files.cnblogs.com/files/lanyincao/live2d.js"></script> 28 <script src="https://files.cnblogs.com/files/lanyincao/waifu-tips.js"></script> 29 <script type="text/javascript">initModel()</script> 30 </body> 31 </html> 32 <link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/yjlblog/flat-ui.min.css"/>
4.修改
将文件地址换成自己文件的地址
5.效果
