博客园背景设置

最新推荐文章于 2023-09-01 17:23:27 发布

weixin_30588907

最新推荐文章于 2023-09-01 17:23:27 发布

阅读量140

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/yitou13/p/10746771.html

版权

最近收到好多朋友私信我怎么做的博客园的首页。我来回答一下吧

1.点击博客设置

2.在修改设置的页面CSS设置中写上你想要的代码

3.保存

我的博客园首页代码

1.首页图片效果代码：

将自己想要的图片放到自己的相册里面，然后链接

#home{

background-image:url("https://www.cnblogs.com/images/cnblogs_com/yitou13/1339024/o_wennuai.jpg");


}

#matrix{position: fixed; top:0; left: 0; z-index: -1; opacity:0.8;}

　2.首页的动画效果：

<!-- 背景动画 -->
<canvas id="c_n9" width="1920" height="990" style="position: fixed; top: 0px; left: 0px; z-index: -1; opacity: 0.5;"></canvas>
<script src="https://files.cnblogs.com/files/jingmoxukong/canvas-nest.min.js"></script>

　3.几乎大家都会问到的那个妹子的效果

这一段可以放在那个首页html里面

<img src="https://www.cnblogs.com/images/cnblogs_com/yitou13/1339024/o_wennuai.jpg">
<canvas id="c_n4" width="1264" height="280" style="position: fixed; top: 0px; left: 0px; z-index: -1; opacity: 0.5;"></canvas>
<canvas id="c_n4" width="300" height="600" style="position: fixed; opacity: 0.7; right: 0px; bottom: -20px; z-index: 99999; pointer-events: none;border-style:hidden;"></canvas>

<html>
  <head>
    <meta charset="UTF-8" />
    <title>Live2d Test Env</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body>
  <script src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>
  <script type="text/javascript">
    L2Dwidget.init();
  </script>
  </body>
</html>

转载于:https://www.cnblogs.com/yitou13/p/10746771.html

weixin_30588907

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
博客园背景设置

最近收到好多朋友私信我怎么做的博客园的首页。我来回答一下吧1.点击博客设置2.在修改设置的页面CSS设置中写上你想要的代码3.保存我的博客园首页代码1.首页图片效果代码：将自己想要的图片放到自己的相册里面，然后链接#home{background-image:url("https://www.cnblogs.com/ima...
复制链接

扫一扫