美化你的博客园——添加看板娘

做了一个我认为比较浅显易懂的随笔

分为三步

1.压缩包下载（点击下载）

2.上传文件

3.添加代码

具体实施

1.首先下载一个压缩包

/---压缩包下载---/

2.上传文件

3.添加代码

将代码粘贴（你要抄一遍我也没有办法）到页脚Html代码

不知道怎么放的请看我上一篇随笔

 1 <!DOCTYPE html> /*看板娘*/ <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta
 2 http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 3 <title>Live2D</title> <link rel="stylesheet" type="text/css"
 4 href="https://files.cnblogs.com/files/kousak/waifu.css"/> <script
 5 src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> </head>
 6 <body> <link rel="stylesheet" type="text/css"
 7 href="https://files.cnblogs.com/files/kousak/waifu.css"> <div class="waifu"
 8 id="waifu"> <div class="waifu-tips" style="opacity: 1;"></div> <canvas
 9 id="live2d" width="280" height="250" class="live2d"></canvas> <div
10 class="waifu-tool"> <span class="fui-home"></span> <span
11 class="fui-chat"></span> <span class="fui-eye"></span> <span
12 class="fui-user"></span> <span class="fui-photo"></span> <span
13 class="fui-info-circle"></span> <span class="fui-cross"></span> </div> </div>
14 <script src="https://files.cnblogs.com/files/kousak/live2d.js"></script>
15 <script src="https://files.cnblogs.com/files/kousak/waifu-tips.js"></script>
16 <script type="text/javascript">initModel()</script> </body> </html> <link
17 rel="stylesheet" type="text/css"
18 href="https://files.cnblogs.com/files/yjlblog/flat-ui.min.css"/>

看板娘大功告成了！

最后看一下成功样例

原文地址：https://www.cnblogs.com/weilinxiao/p/11140648.html

时间： 2024-10-04 10:06:12

美化你的博客园——添加看板娘的相关文章

博客园live2d 看板娘简单光速

博客园live2d 看板娘简单光速直接粘贴到--博客侧边栏公告,需要JS支持  <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Live2D<

博客园添加背景音乐,背景效果!

目录博客园添加背景音乐,背景效果申请博客园JS权限添加网易云背景音乐点击鼠标点击样式二次元看板娘雪花效果原文地址:https://www.cnblogs.com/1212dsa/p/11438461.html

博客园添加目录的方法主要涉及2个步骤: 1.申请开通js权限 2.添加js脚本到“页脚Html代码” <script language="javascript" type="text/javascript"> // 生成目录索引列表 // ref: http://www.cnblogs.com/wangqiguo/p/4355032.html // modified by: zzq function GenerateContentList() { var

博客园添加鼠标粒子吸附特效

本文从以下三个方面, 阐述在博客园添加鼠标粒子吸附特效: 一. 效果展示二. 权限申请三. 设置步骤一. 效果展示在博客园的页面, 出现鼠标粒子吸附的特效, 如图所示: 二. 权限申请点击博客园的[管理] → [设置]→ 一直往下拉, 找到[博客侧边栏公告(支持HTML代码)(申请JS权限)] 向[email protected] 发送邮件, 为了尽快通过权限申请, 邮件模板如下: 尊敬的博客园管理员: 请问是否可以帮我开通js权限,我需要一些简单的js来解决问题,例如鼠标点击特效.代

博客园添加markdown文章导航栏

博客园添加Markdown文章导航栏我正在翻译Spring Framework文档,发布到博客园之后发现文章太密集,猛一看到比较懵,由于看到博客园支持自定义页面,我觉得添加一个导航栏,结构上会更加清晰一些. 所以在网上搜了搜关于添加导航栏的文章,搜到一个试了试,有些问题,所以就自己写了一个,实现功能如下: 主要搜索主页面中的h1-h6 根据1-6的级别设置字体大小和缩进宽度滚动时页面最上方的标题对应导航将加粗支持展开隐藏(默认隐藏,如果默认打开,就将js代码第6行display:none改

为你的博客园添加平滑移动到页面顶端的锚点和tag云

首先我的目录是在marvin的基础上二次开发的.然后我发现锚点图和目录都在同一个图上面,所以就一起用了. 返回顶部锚点: 我用以前旧版bilibili的那个函数.可以做到平滑滚动到页面,并且在触顶前不能向下滚屏.具体的看我参考链接.当然因为涉及到js要申请权限,简单的话a标签href用#top当然可以,体验有点差罢了. 然后因为我懒,锚点的出现条件直接和目录的出现条件弄在一起.也就是匹配元素相对滚动条顶部的偏移超过200时显示. tag云: 我用Google随便找的.用的矢量绘图. 但是这玩意有

【转】为博客园添加目录的方法总结

本文转自:作者:妙音天女地址:http://www.cnblogs.com/xuehaoyue/p/6650533.html 目录第一种:在正文上方直接添加目录 1. 申请开通js权限 2. 添加js脚本到“页脚Html代码” 3. 按格式写文章第二种:在文章右上角添加目录导航 1. 申请开通js权限 2. 添加css代码到“页面定制CSS代码” 3. 添加js脚本到“页首Html代码” 4. 按格式写文章参考链接:http://www.cnblogs.com/xdp-gacl/p

博客园添加网站统计访问量-操作简单很实用哦！

浏览博客园,看到这个小文章,跟着操作了一下,可以定制网站的访问人数.访问量,需要的亲果断试试看吧! 效果图: 博文: 无意中看到有这个访问量的统计,觉得挺好玩的,我们现在就来添加一个吧: 1. 先到http://www.amazingcounters.com/sign-up.php 这个地址去申请一个帐户,申请时填写好自己的资料,比如你的统计风格样式.要统计的地址.要统计的类型,是浏览量(PV) 还是访客数(UV),或者你也可以2个都统计:这些统计数据都是可以任意修改的哟,不过我们最好还

博客园添加一个分享的

给自己的博客添加一个分享的按钮吧!! 可以遇见更多志同道合的人呀!!! 使用百度的一键生成按钮就可以了:http://share.baidu.com/code 或者自己写一个也是一样的   <script type="text/javascript" > var jiathis_config={ siteNum:15, sm:"copy,qzone,tsina,