建站笔记

2025-05-31
05-31
子比主题 - 专题&分类聚合卡片上移-汇聚访

实用子比主题 – 专题&分类聚合卡片上移

这是一个子比主题小工具分类聚合卡片，今天看到别的站点这个挺好看的，然后就弄了下来，今天分享给大家！原作者是狐狸库！！ 演示效果： 代码部署： [hidecontent type="reply"] 把下方代码放到自定义代码css中 两个二选一 都一样！ 第一款第二款 .clearfix .zib-widget.term-aggregation .term-img { width: 18.5em; } .clearfix .zib-widget.term-aggregation .term-img .graphic { margin-top: -40px; } @media screen and (min-width:1024px) and (max-width: 1240px) { .clearfix .zib-widget.term-aggregation .term-img...
6个月前
建站笔记
2025-05-30
05-30
子比主题 - 侧边栏添加鼠标移入悬浮&扫光效果百度一下小工具-汇聚访

实用子比主题 – 侧边栏添加鼠标移入悬浮&扫光效果百度一下小工具

这个效果是墨星写的，我在其他站点看到的，然后就扒了下来，今天分享给大家！ 演示效果： 代码部署： [hidecontent type="payshow"] 代码分为三个部分，HTML和CSS和JS部分，话不多说直接开始部署吧！直接把代码共同放在小工具-自定义HTML里即可！ HTMLCSSJS <div class="mx-search-widget"> <div class="mx-banner">百度一下-协助本站SEO</div> <div class="mx-search-container"> <input type="text" id="mx-searchInput" placeholder="汇聚访" value="汇聚访"> <button onclick="mx_search()" class="mx-button">立即搜索</button> </div> </div> <style> /*www.huijuf.com*/ .mx-search-widget { width: 100%; margin: 15px 0; position: relative; overflow:...
6个月前
建站笔记
2025-05-25
05-25
子比主题 - 网站底部添加滚动波浪-汇聚访

实用子比主题 – 网站底部添加滚动波浪

今天分享一个自适应的底部波浪部署教程，希望对大家有用！手机端PC端自适应的哦~ 演示效果： 代码部署： [hidecontent type="payshow"] CSSPHP 把下面代码放到主题设置里的自定义CSS代码里！ /*网站底部波浪www.huijuf.com*/ .waves { position: relative; width: 100%; height: 15vh; margin-bottom: -7px; min-height: 50px; max-height: 80px; } .parallax>use { animation: move-forever 25s cubic-bezier(.55, .5, .45, .5)infinite; } .parallax>use:nth-child(1) {...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - 侧边栏小工具会员广告小模块-汇聚访

实用子比主题 – 侧边栏小工具会员广告小模块

侧边小工具会员广告小模块，炫彩色的美化样式，非常好看，给自己的子比主题侧边加上一款会员模块，很实用 演示效果： 代码部署： [hidecontent type="payshow"] HTMLCSS 将下面代码放到：外观-小工具-侧边即可，要选择自定义HTML小工具，将下面代码放到里面 <div class="ztw-bj zib-widget mb10-sm ztw-bj"> <div class="colorful-make" style="transform: rotate(-9deg) scale(0.7);"></div> <div class="text-center"> <div class=""> <div class="ac"><b class="em14">成为永久黄金会员本站免费下载</b></div> <div style="" class="em09 opacity8">每日更新只出精品资源</div><br> <a style="--this-color:#f2c97d;--this-bg:rgba(62,62,67,0.9);" class="mt6 but radius jb-red px12...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - notyf提示框扫光效果美化-汇聚访

实用子比主题 – notyf提示框扫光效果美化

今天逛别人站点的时候，发现这个效果很好看，于是就扒了下来，今天就分享给大家吧！原作者是墨星哈！ 演示效果： 代码部署： [hidecontent type="payshow"] 复制下面css代码 进入子比主题设置-全局-自定义代码-自定义css代码 .notyf{border-radius:var(--main-radius) 0 0 var(--main-radius);position:relative;overflow:hidden;backdrop-filter:blur(8px);box-shadow:0 8px 32px rgba(0,0,0,0.1);transition:all 0.3s ease}.notyf:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,0.2)}@keyframes ripple{0%{background-position:0% 50%;box-shadow:0 0 25px rgba(255,255,255,0.4)}50%{background-position:100% 50%;box-shadow:0 0 40px rgba(255,255,255,0.5)}100%{background-position:0% 50%;box-shadow:0 0 25px rgba(255,255,255,0.4)}}@keyframes shine{0%{transform:translateX(-100%) translateY(-100%) rotate(25deg);opacity:0}25%{opacity:0.5}75%{opacity:0.5}100%{transform:translateX(100%)...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - 会员引导悬浮窗[代码版]-汇聚访

实用子比主题 – 会员引导悬浮窗[代码版]

之前有倦意大佬发过插件版本的，今天分享一下代码版本的吧！ 演示效果： 代码部署： [hidecontent type="payshow"] 放自定义顶部或底部html都可以，也可以放文件里，都随意！图片可自行更换哦~ <!-- Made by Juanyi --> <!-- 和子比有兼容问题的记得注释掉，如果没引用Jquery记得把注释取消 --> <!-- <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.js"></script> --> <script src="https://cdn.bootcdn.net/ajax/libs/js-cookie/3.0.5/js.cookie.js"></script> <style> /* 活动背景图片 */ .vip-login-tip { background-image: url(https://pic1.imgdb.cn/item/6900b5db3203f7be00ac790b .png) } </style> <script> //快捷施法专区，懒人福音⬇️⬇️⬇️ // 结束时间 var...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - 底部添加蓝色波浪美化-汇聚访

实用子比主题 – 底部添加蓝色波浪美化

这个美化也是很久之前的美化了，发出来记录一下吧，希望对大家有用！ 演示效果： 代码部署： [hidecontent type="reply"] 进入宝塔面板，进入子比主题文件夹（zibll）找到footer.php文件夹，在footer标签(</footer>)下面添加下面代码。 <!--底部波浪开始 汇聚访www.huijuf.com--> <div class="wiiuii_layout"> <svg class="editorial" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 28" preserveAspectRatio="none"> <defs> <path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - 幻灯片底部虚化-汇聚访

实用子比主题 – 幻灯片底部虚化

今天给大家分享一款样式，这款样式是可以让幻灯片底部虚化的，结合起来非常好看！ 演示效果： 代码部署： [hidecontent type="payshow"] 将代码放到后台自定义CSS！ .absolute::before { content: ''; display: block; position: absolute; left: 0; top: 58%; right: 0; bottom: 0; transform: scale(1.01); background: linear-gradient(180deg, rgb(255 255 255 / 0%) 0%, var(--body-bg-color) 100%); }...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - 顶部多功能组件导航美化-汇聚访

实用子比主题 – 顶部多功能组件导航美化

这是子比主题的一款快速导航链接美化效果，这个效果最初是在极主题上看到的，于是就照着样式仿了一下，这个效果还是比较适合一些ACG站点的，话不多说喜欢的自行部署吧！ 演示效果： 代码部署： [hidecontent type="reply"] 定位：子比主题–>>页面&显示–>>顶部多功能组件–>>组件【下方】添加额外内容，将下面的代码丢里面即可，如果还不知道在哪，如下图！！ <div class="soft-cat-logo"> <a href="/yxsx"><span> <picture class="picture"> <source type="image/webp" srcset="https://img.dmguo.cn/2025/02/20250212023355196.png"><img class="jitheme-radius" src="https://img.dmguo.cn/2025/02/20250212023355196.png"> </picture> </span><em>游戏资源</em> </a><a href="/7b2"><span> <picture class="picture"> <source type="image/webp" srcset="https://img.dmguo.cn/2025/02/20250212023345786.png"><img class="jitheme-radius" src="https://img.dmguo.cn/2025/02/20250212023345786.png"> </picture> </span><em>主题美化</em> </a><a href="/forums"><span> <picture class="picture"> <source...
6个月前
建站笔记
2025-05-24
05-24
子比主题 - 分类栏目美化（两款）-汇聚访

实用子比主题 – 分类栏目美化（两款）

网站分类栏目美化的意义主要体现在提升用户体验和视觉吸引力，以及优化搜索引擎排名等方面。本文章将给大家分享两种分类栏目美化的教程哦~ 演示效果①： 演示效果②： 代码部署： [hidecontent type="reply"] 将下方代码加入到后台CSS里即可！图片放在帖子附件里了，可自行下载！ 效果①效果② .index-tab ul>li.active { color: #ffffff00 !important; background-color: #ffffff00 !important; border-radius: 6px; z-index: 1; position: relative; height: 39px; line-height: 44px; background: url(https://img.dmguo.cn/2025/01/20250120091106173.png); background-repeat: no-repeat; -webkit-background-size: 91px 39px; -moz-background-size:...
6个月前
建站笔记
1…2021222324…30跳转