看板娘是一种职业和习惯称呼,也是ACGN次文化中的萌属性之一。简而言之就是小店的女服务生,也有“吸引顾客,招揽生意,提高人气”等作用类似品牌形象代言人的含义。

如果想在自己的博客上放一个呆萌的看板娘非常的简单只需要简单的几行代码就能实现。

这时可以看我自己博客的看板娘,就在右下角。

js代码

<script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.0.min.js"></script>
<script type="text/javascript" charset="utf-8" src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.min.js"></script>
<script type="text/javascript">
L2Dwidget.init({"display": {
"superSample": 2,
"width": 200,
"height": 400,
"position": "right",
"hOffset": 0,
"vOffset": 0
}
});
</script>

在这里我们需要引入两个教室L2Dwidget.0.min.js和L2Dwidget.min.js。这两个js你可以从我的页面直接拿走。

css代码

#live2dcanvas {
border: 0 !important;
}

html不用写,就可以看到一个呆萌的看板娘,如果需要放到自己的博客里看的话只需要在设置里的页面定制CSS代码和JS上加上下面的代码,如果不支持JS代码申请一下就行了。

 到这里你就可以看到一个活泼可爱的看版娘了。

网页添加Live2D看板娘简易教程的更多相关文章

  1. 网页添加 Live2D 看板娘

        我是先参考别人的[点击跳转]博客来做的.不过我发现网上很多人都没有把一些细节写出来,用了别人那里下载的文件后里面的一些跳转链接就跳到他们的页面了.所以我这里写一写如何修改这些跳转链接吧. 1. ...

  2. 网页添加Live2D看板娘

    看板娘简而言之就是小店的女服务生,也有“吸引顾客,招揽生意,提高人气”等作用类似品牌形象代言人的含义. 如果想放一个呆萌的看板娘在博客上 js <script type="text/j ...

  3. 在网页添加 Live2D 看板娘

    只需要将以下代码粘贴到 标签中即可 <!--看板娘--> <script src="https://cdn.jsdelivr.net/npm/jquery/dist/jqu ...

  4. Hexo 添加Live2D看板娘

    title: Hexo 添加 Live2D看板娘 二次元什么的最喜欢了[大好きです] 准备 项目地址 live2d模型 部分模型预览 开始 首先进入Hexo博客根目录安装live2d插件 $ npm ...

  5. Hexo添加Live2D看板娘+模型预览

    文章目录 添加和注意事项 模型预览 live2d-widget-model-chitose live2d-widget-model-epsilon2_1 live2d-widget-model-gf ...

  6. Vue最简单的实现网页Live2D看板娘

    Live2D看板娘 前言 二.使用步骤 1.引入 2.设置样式 结尾(后续更新更强的配置看板娘~) 前言 最近想给自己的网页添点新花样,然后就想到了别人的网站都有一些看板娘的玩意儿,看着很舒服,鉴于自 ...

  7. 文章中左下角的妹子live2d看板娘

    关键词: live2d看板娘 自行搜索即可 攻略很多

  8. 博客美化—添加萌萌的live2D看板娘(不能再简单了)

    看着很多博客都有live2D的萌萌哒看板娘,我闲着有空说干就干. 从参考博客的附件中下载资源文件 waifu.css waifu-tips.js live2d.js flat-ui.min.css// ...

  9. Vue看板娘教程1.0

    Live2D看板娘 前言(PS:本教程使用的Vue项目) 一.下载文件 二.使用步骤 1.引入文件 2.引入js 3.修改app.vue 4.如何换模型? 更换模型的效果 5.如何换语音? 结尾(后续 ...

随机推荐

  1. Mybatis整合spring详细教程(适合小白童鞋)

    目录 1.整合思路 2.整合需要的jar包 3.整合的步骤 4.Dao的开发的两种实现方式 6.Dao的开发的实现方式总结图 @ Mybatis整合spring其实就是SSM框架中SM的整合集成. 1 ...

  2. WWDC 2016 盛宴

    转自:http://www.jianshu.com/p/72dd8306c817 整理和维护人:pmstGitHub 链接:WWDC-2016-Feast目前只是整理官方给出的 WWDC 2016 视 ...

  3. VSCode 入门

    一 基本布局 二 主题设置 2.1 选择颜色主题 方式一 文件 -> 首选项 -> 颜色主题 -> 上下按键 切换预览 -> enter选择 或者 CTRL + K CTRL ...

  4. [TimLinux] JavaScript querySelectorAll返回对象无法使用indexOf问题

    1. querySelectorAll 该函数返回的对象类型为NodeList,这个类型并没有indexOf方法,如果需要使用indexOf方法,需要先将该对象每一项转存入Array对象中,然后就可以 ...

  5. A*算法在最短路问题的应用及其使用举例

    1 A*算法 A*算法在人工智能中是一种典型的启发式搜索算法,启发中的估价是用估价函数表示的: 其中f(n)是节点n的估价函数,g(n)表示实际状态空间中从初始节点到n节点的实际代价,h(n)是从n到 ...

  6. 深入探讨多态性及其在Java中的好处

    多态是面向对象软件的基本原理之一.该术语通常表示可以具有多种形式的事物.在面向对象的方法中,多态使编写具有后期绑定引用的程序成为可能.尽管在Java中创建多态引用很容易,但其背后的概念对整体编程产生了 ...

  7. checkbox多选框取值

    var SelectQuestionAnswer = $("input:checkbox[name='SelectQuestionAnswer']:checked").map(fu ...

  8. scrapy框架(二)

    scrapy框架(二) 一.scrapy 选择器 概述: Scrapy提供基于lxml库的解析机制,它们被称为选择器. 因为,它们“选择”由XPath或CSS表达式指定的HTML文档的某部分. Sca ...

  9. Python基础-day01-9

    变量的命名 目标 标识符和关键字 变量的命名规则 0.1 标识符和关键字 1.1 标识符 标示符就是程序员定义的 变量名.函数名 名字 需要有 见名知义 的效果,见下图: 标示符可以由 字母.下划线 ...

  10. .NET Core 3终结点不能映射控制器

    今天在学.net core的时候发现了一个问题,终结点死活映射不了自己添加的控制器,后经过研究发现解决方法,可能这个问题不应该叫做问题,可是我是初学者,就把这个问题给拎出来.本人开发环境 VS2019 ...