Sakura樱花雪

博客前端其他杂项

紫陌红尘·2020-01-30 03:05·332 次阅读

博客前端其他杂项

1、实现标签小图标


<link rel="Bookmark" type="image/x-icon" href="https://blog-static.cnblogs.com/files/yukarin/yukarin5.ico" />
<link rel="icon" type="image/x-icon" href="https://blog-static.cnblogs.com/files/yukarin/yukarin5.ico" />
<link rel="shortcut icon" type="image/x-icon" href="https://blog-static.cnblogs.com/files/yukarin/yukarin5.ico" />


2、live2D(二)

这个更强,增加了菜单和换装,换形象等功能,最终实现代码如下


<!DOCTYPE html>
<html xmlns="https://www.cnblogs.com/yukarin/">
<img src="https://images.cnblogs.com/cnblogs_com/yukarin/1639008/o_200129105929%E7%B4%AB%E5%A6%B963296370_p0.jpg" width="200px" style="border-radius:50%">
<head>
      <link rel="Bookmark" type="image/x-icon" href="https://blog-static.cnblogs.com/files/yukarin/yukarin5.ico" />
<link rel="icon" type="image/x-icon" href="https://blog-static.cnblogs.com/files/yukarin/yukarin5.ico" />
<link rel="shortcut icon" type="image/x-icon" href="https://blog-static.cnblogs.com/files/yukarin/yukarin5.ico" />
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     <title>Live2D</title>
     <link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/yjlblog/flat-ui.min.css"/>
     <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/yukarin/waifu.css"/>
     <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
     <link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/yukarin/waifu.css">
     <div class="waifu" id="waifu" style="float:right;">
 
         <div class="waifu-tips" style="opacity: 1;"></div>
         <canvas id="live2d" width="280" height="250" class="live2d" position='right'></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/yukarin/live2d.js"></script>
     <script src="https://blog-static.cnblogs.com/files/yukarin/waifu-tips2.js"></script>
     <script type="text/javascript">initModel()</script>
</body>
</html>

来源的大佬地址:


https://www.cnblogs.com/yjlaugus/p/8724881.html


嘿嘿~

image

posted @   紫陌红尘丶  阅读(332)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
点击右上角即可分享
微信分享提示