子比主题 – 添加闪动IPv6标识效果

飞流 · 发表于 2025-10-6 20:51:30

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

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

×

很多网站都支持IPv6，但是对于很多网站想要一个标识的效果给自己的网站，此效果本站在底部，可以查看，非常美观的一个闪动Pv6标识

代码部署
两个代码，一个HTML和CSS
HTML代码
HTML代码放到你想放的地方，建议放到底部，我觉得比较美观，自己随便放就行！

<span class="tengfei_ipv6 tag_ipv6">IPv6</span>

复制代码

CSS代码
CSS放到：子比主题–>>自定义CSS样式即可！

.tengfei_ipv6{display: inline; padding: 0.2em 0.6em; margin: 0px 5px; border-radius: 0.25em; background: rgb(92, 184, 92); color: rgb(255, 255, 255); font-size: 12px; font-weight: 200; line-height: 20px; vertical-align: baseline;}
.tag_ipv6{display:inline!important;float:none!important;padding:.2em .6em;margin:0 5px;position:relative!important;overflow:hidden;outline:none;border-radius:.25em;background:#5cb85c;color:#fff;font-size:12px;font-weight:200;line-height:20px;vertical-align:super;animation:blink 1s linear infinite;-webkit-animation:blink 1s linear infinite;-moz-animation:blink 1s linear infinite;-ms-animation:blink 1s linear infinite;-o-animation:blink 1s linear infinite;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.tag_ipv6,.tag_ipv6 a,.tag_ipv6 a:hover,.tag_ipv6:hover{text-decoration:none!important}.tag_ipv6:after{background:#5cb85c;-moz-transform:translateX(-50%) translateY(-50%) rotate(-25deg);-ms-transform:translateX(-50%) translateY(-50%) rotate(-25deg);-webkit-transform:translateX(-50%) translateY(-50%) rotate(-25deg);transform:translateX(-50%) translateY(-50%) rotate(-25deg)}@keyframes blink{0%{opacity:1;border:1px solid #fff;background-color:transparent;transition:all .4s ease-in-out}50%{opacity:.9;border:1px solid #5cb85c}to{opacity:.9;border:1px solid #fff}}@-webkit-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}@-moz-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}@-ms-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}@-o-keyframes blink{0%{opacity:1}50%{opacity:.9}to{opacity:1}}.tag_ipv6:after{content:"";height:100%;width:100%;position:absolute;display:inline;margin:0;top:0;left:0;z-index:-1;animation:pulsate 1s ease-out;animation-iteration-count:infinite;animation-delay:1.1s}@keyframes pulsate{0%{transform:scale(.1);opacity:0;filter:alpha(opacity=0)}50%{opacity:1;filter:none}to{transform:scale(1.2);opacity:0;filter:alpha(opacity=0)}}

复制代码

	爱是难逃：	07-23 18:52
	飞流：这论坛到底有没有资本给我投资一下啊！	07-20 22:07
	系统消息：飞流安卓客户端APP已上线，请在QQ群（123129）群文件内获取下载。	02-21 02:22
	麦麦管家：请遵守版规社律，保护信息安全，请勿脱离平台交易，谨防网络诈骗！#帮助中心#	01-24 12:40

[代码技巧] 子比主题 – 添加闪动IPv6标识效果

起源之星

任务·年会员

累计签到LV.3

摩羯座

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

本帖被以下淘专辑推荐:

相关帖子

飞流广播+ 发布

起源之星

任务·年会员

累计签到LV.3

摩羯座

关于我们

常用功能

服务引导