博客美化—添加萌萌的live2D看板娘(不能再简单了)
看着很多博客都有live2D的萌萌哒看板娘，我闲着有空说干就干。
- 从参考博客的附件中下载资源文件
- waifu.css
- waifu-tips.js
- live2d.js
- flat-ui.min.css//若不加菜单可以不引入
- 上传资源文件到博客园
- 申请js权限
- 设置博客园页脚Html代码(其中的资源文件可以替换成你自己的url)
页脚Html代码
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/lgjbky/waifu.css"/>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/lgjbky/flat-ui.min.css"/>
</head>
<body>
<div class="waifu">
<div class="waifu-tips"></div>
<canvas id="live2d" width="280" height="250" class="live2d"></canvas>
<div class="waifu-tool">
<span class="fui-home"></span>
<span class="fui-chat"></span>
<span class="fui-eye"></span>
<span class="fui-user"></span>
<span class="fui-photo"></span>
<span class="fui-info-circle"></span>
<span class="fui-cross"></span>
</div>
</div>
<script src="https://blog-static.cnblogs.com/files/lgjbky/waifu-tips.js"></script>
<script src="https://blog-static.cnblogs.com/files/lgjbky/live2d.js"></script>
<script type="text/javascript">initModel()</script>
</body>
</html>
