子比主题 – 特效广告位样式美化

飞流 · 发表于昨天 18:24

资源无需等待，交易就趁现在，全面资源整合网络大咖云集，让你轻松玩转互联网！

您需要登录才可以下载或查看，没有账号？立即注册

×

这是别人发给腾飞博客的，别人说是买来的，并且排版还有问题，腾飞博客修复了一下，修复了两个大图广告位效果不好，喜欢的自行部署吧！

tengfei_down - 2025-10-10T182402.843.webp

代码部署

定位：WP后台–>>外观–>>小工具–>>自定义HTML，将下面的代码放到里面然后放到自己喜欢的位置吧！

<style>
.main-images{display:flex;gap:10px;margin-bottom:10px;width:100%}.neon-animated{position:relative;flex:1;min-height:0}.neon-animated img{display:block;width:100%;height:100%;object-fit:cover;border-radius:6px;min-height:200px}.neon-animated::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;border:4px solid #fff;border-radius:6px;box-shadow:0 0 10px #fff,0 0 20px #fff,0 0 30px #fff,0 0 40px #0ff,0 0 70px #0ff,0 0 80px #0ff,0 0 100px #0ff;animation:neon-glow 2s linear infinite;pointer-events:none}@keyframes neon-glow{0%,100%{box-shadow:0 0 10px #fff,0 0 20px #fff,0 0 30px #fff,0 0 40px #0ff,0 0 70px #0ff,0 0 80px #0ff,0 0 100px #0ff}50%{box-shadow:0 0 10px #0ff,0 0 20px #0ff,0 0 30px #0ff,0 0 40px #fff,0 0 70px #fff,0 0 80px #fff,0 0 100px #fff}}.ad{background:#fff;overflow:hidden;clear:both;border-radius:6px;margin-bottom:10px;padding:5px}.ad ul{display:flex;list-style:none;gap:5px}.ad li{flex:1}.ad a{display:block;border-radius:3px;text-decoration:none}.ad img{max-width:100%;border-radius:3px}.ad li a{line-height:60px;height:60px;color:#fff;background:#2f4056;text-align:center;font-size:24px}.txtguanggao{width:100%;overflow:hidden;display:block;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);margin-bottom:10px}.txtguanggao a{width:calc((100% - 20px)/ 4);float:left;border-radius:2px;line-height:35.35px;height:35.35px;text-align:center;font-size:14px;color:#fff;display:inline-block;margin:2.5px;transition-duration:.3s;text-decoration:none}.txtguanggao a:nth-child(1){background-color:#dc3545}.txtguanggao a:nth-child(2){background-color:#007bff}.txtguanggao a:nth-child(3){background-color:#28a745}.txtguanggao a:nth-child(4){background-color:#ffc107}.txtguanggao a:hover{background:#ff2805;color:#fff}@media(max-width:999px){.main-images{flex-direction:column}.ad ul{flex-direction:column}.ad li{width:100%}.txtguanggao a{width:calc((100% - 10px)/ 2)}}@media screen and (min-width:1000px){.txtguanggao a{width:calc((100% - 20px)/ 4)}}
</style>
<div class="main-images">
<div class="neon-animated">
<img src="https://www.tfbkw.com/wp-content/uploads/2025/03/20250714220647415-1-800x341.webp" alt="子比主题美化教程">
</div>
<div class="neon-animated">
<a href="/" target="_blank">
<img src="https://www.tfbkw.com/wp-content/uploads/2025/03/20250714220647415-1-800x341.webp" alt="广告图片">
</a>
</div>
</div>
<div class="ad">
<ul>
<li>
<a href="#" target="_blank" rel="noopener">广告招商腾飞博客</a>
</li>
<li>
<a href="#" target="_blank" rel="noopener">广告招商腾飞博客</a>
</li>
</ul>
</div>
<div class="txtguanggao">
<a href="#" target="_blank" class="dh" rel="noopener">腾飞博客炫酷广告位</a>
<a href="/" target="_blank" class="dh" rel="noopener">腾飞博客炫酷广告位</a>
<a href="#" target="_blank" class="dh" rel="noopener">腾飞博客炫酷广告位</a>
<a href="#" target="_blank" class="dh" rel="noopener">腾飞博客炫酷广告位</a>
</div>

复制代码

	系统消息：柒沐已经连续答对10道难题，逆天学霸谁与争锋？！#每日答题#	10-09 09:07
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	09-24 09:00
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	09-11 11:40
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	09-02 09:17
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	08-27 08:56
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	08-20 15:12
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	08-03 10:22
	系统消息：柒沐已经连续答对10道难题，逆天学霸谁与争锋？！#每日答题#	06-30 08:57
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	06-18 09:14
	系统消息：清风网络已经连续答对10道难题，逆天学霸谁与争锋？！#每日答题#	04-11 09:40
	系统消息：清风网络已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	04-10 09:31
	系统消息：IXM77777已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	04-09 13:44
	系统消息：清风网络已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	04-09 09:22
	系统消息：柒沐已经连续答对10道难题，逆天学霸谁与争锋？！#每日答题#	04-09 08:52
	系统消息：清风网络已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	04-08 09:24
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	04-07 09:02
	系统消息：柒沐已经连续答对10道难题，逆天学霸谁与争锋？！#每日答题#	02-27 09:35
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	02-26 09:06
	系统消息：柒沐已经连续答对3道难题，逆天学霸谁与争锋？！#每日答题#	02-25 08:49
	系统消息：飞流安卓客户端APP已上线，请在QQ群（123129）群文件内获取下载。	02-21 02:22

[代码技巧] 子比主题 – 特效广告位样式美化

资源无需等待，交易就趁现在，全面资源整合网络大咖云集，让你轻松玩转互联网！

代码部署

相关帖子

飞流广播+ 发布

连签LV.1

会员LV.1

会员LV.2

会员LV.3

会员LV.4

会员LV.5

会员LV.6

会员LV.7

会员LV.8

会员LV.9

会员LV.10

关于我们

常用功能

服务引导

fl@fllt.cn