论坛首页 › 建站教程 › 建站教程H5盲盒美化教程菜鸟教程美化,教程 - Powered by Discuz!

huaidan 发表于 2025-3-28 16:00:11

建站教程H5盲盒美化教程菜鸟教程美化,教程 - Powered by Discuz!

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css"><font color="#cc99ff">美化首页 增加特效</font><br /><font color="#cc99ff">下面通霸云整理了几点</font><br /><font color="#cc99ff">数据头像显示增加10个左右</font><br /><font color="#cc99ff">增加樱花飘落效果</font><br /><font color="#cc99ff">增加鼠标点击爱心效果</font><br /><font color="#cc99ff">增加轮播图下 GIF图片</font><br /><font color="#cc99ff"><br /></font><br /><font color="#cc99ff">头像展示数据增加</font><br /><font color="#cc99ff">首页樱花特效</font><br /><font color="#cc99ff">添加网易云</font><br /><font size="3"><font color="#ff0000"><strong>添加头像展示</strong></font></font><br /><ol><li>&lt;!-- total --&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;div &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&quot;&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&lt;div &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;lay&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;modal&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;form&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;tabs&quot;&gt;&lt;/p&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou1&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou2&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou3&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou4&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou5&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou6&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou8&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou9&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &lt;span &lt;span class=&quot;token keyword&quot;&gt;class&lt;/span&gt;=&quot;total&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;cover&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;item&quot; &lt;span class=&quot;token keyword&quot;&gt;style&lt;/span&gt;=&quot;background&lt;span class=&quot;token token-operator punctuation&quot;&gt;-&lt;/span&gt;image&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt; url&lt;span class=&quot;token punctuation&quot;&gt;(&lt;/span&gt;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/touxiang/tou10&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;jpg&lt;span class=&quot;token punctuation&quot;&gt;)&lt;/span&gt;;&quot;&gt;&lt;/span&gt;</ol><br /><br /><br /><br /><font size="4"><font color="#ff0000"><strong>首页樱花 点击 特效 GIF图片</strong></font></font><br />演示如下 这里采用别人的js 你们到时候自己搬到自己站点 创建目录复制进去就可以了<br /><br />代码如下<br /><br /><ol><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&lt;!-- 樱花飘落效果 --&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&lt;script &lt;span class=&quot;token keyword&quot;&gt;type&lt;/span&gt;=&quot;text/javascript&quot; src=&quot;https&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//api&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;azpay&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/&lt;span class=&quot;token number&quot;&gt;729&lt;/span&gt;/&lt;span class=&quot;token number&quot;&gt;5&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;js&quot;&gt;&lt;/script&gt;&nbsp; &nbsp;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&lt;!-- 鼠标点击爱心效果 --&gt;<br /><li>&lt;script &lt;span class=&quot;token keyword&quot;&gt;type&lt;/span&gt;=&quot;text/javascript&quot; src=&quot;https&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//api&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;azpay&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/&lt;span class=&quot;token number&quot;&gt;729&lt;/span&gt;/&lt;span class=&quot;token number&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;js&quot;&gt;&lt;/script&gt;&nbsp;&nbsp;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&lt;!-- GIF图片 --&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&lt;img src=&quot;http&lt;span class=&quot;token punctuation&quot;&gt;:&lt;/span&gt;//we7&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;kjq66&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token keyword&quot;&gt;cn&lt;/span&gt;/&lt;span class=&quot;token number&quot;&gt;1634554954&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;gif&quot;&gt;</ol><br />添加音乐代码如图所示<br />现在好像很多盲友都在问如何添加音乐 这里给您演示下<br /><br /><ol><li>&nbsp; &nbsp;&nbsp; &nbsp; &lt;!--网易云播放代码--&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&lt;iframe frameborder=&quot;no&quot; border=&quot;&lt;span class=&quot;token number&quot;&gt;0&lt;/span&gt;&quot; marginwidth=&quot;&lt;span class=&quot;token number&quot;&gt;0&lt;/span&gt;&quot; marginheight=&quot;&lt;span class=&quot;token number&quot;&gt;0&lt;/span&gt;&quot; &lt;span class=&quot;token keyword&quot;&gt;width&lt;/span&gt;=&lt;span class=&quot;token number&quot;&gt;330&lt;/span&gt; height=&lt;span class=&quot;token number&quot;&gt;110&lt;/span&gt; src=&quot;//music&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;token number&quot;&gt;163&lt;/span&gt;&lt;span class=&quot;token punctuation&quot;&gt;.&lt;/span&gt;com/outchain/player?type=&lt;span class=&quot;token number&quot;&gt;0&lt;/span&gt;&amp;id=&lt;span class=&quot;token number&quot;&gt;7024828885&lt;/span&gt;&amp;auto=&lt;span class=&quot;token number&quot;&gt;1&lt;/span&gt;&amp;height=&lt;span class=&quot;token number&quot;&gt;90&lt;/span&gt;&quot;&gt;&lt;/iframe&gt;<br /><li>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&lt;!--代码结束--&gt;</ol><br /><br /><br /><br /><br /><br />    <h3>版权声明</h3>            <p>1、本站所有资源来源于网络搜集和会员分享</p><p>2、本站所有程序仅供大家学习和参考，不得进行商业用途</p><p>3、如果觉得程序还可以、请购买官方正版</p><p>4、对不遵守本声明或其他违法、恶意使用本网站内容者，本网站保留追究其法律责任的权利。</p>      <p>唯一网址: <a target="_blank" href='https://bbs.zonghengtx.cn/thread-2472-1-1.html' title='H5盲盒美化教程'>https://bbs.zonghengtx.cn/thread-2472-1-1.html</a></p>

huaidan 发表于 2025-3-28 16:10:37

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">有竞争才有进步嘛

huaidan 发表于 2025-3-28 16:21:44

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">过来看看的

huaidan 发表于 2025-3-28 16:44:53

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">帮帮顶顶！！

huaidan 发表于 2025-3-28 16:50:54

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">看帖回帖是美德！

huaidan 发表于 2025-3-28 17:13:47

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">看帖回帖是美德！

huaidan 发表于 2025-3-28 17:23:37

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">这是什么东东啊

huaidan 发表于 2025-3-28 17:39:42

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">看帖回帖是美德！

huaidan 发表于 2025-3-28 18:01:01

<link rel="stylesheet" type="text/css" href="source/plugin/qzom_thread/styles/4/styles.css">我抢、我抢、我抢沙发~

查看完整版本: 建站教程H5盲盒美化教程菜鸟教程美化,教程 - Powered by Discuz!