
剑去主题
出售B2子主题,限时促销!请直接去授权中心购买。
今天给大家分享一款自用的子比主题文章详情页,很早之前就想发出来,因为没有适配,看很多人需要所以我抓紧适配了一下,话不多说直接开始,喜欢的自行部署!
![图片[1]-子比主题 – 文章详情页带Tab切换美化-剑去主题 - 子比美化、B2美化、B2子主题!](https://www.swordgo.cn/wp-content/uploads/2025/06/1b6780b6b620250601131108.gif)
代码部署
一共两个代码,一个是PHP代码,一个是CSS代码,你可以引入文件也可以放到:子比主题–>>自定义CSS样式即可!
定位:/wp-content/themes/zibll/inc/functions/zib-single.php文件,我们找到下面的函数,如下图
CSS
你可以引入文件,如果不会引入直接无脑丢到子比主题:子比主题–>>自定义CSS样式即可!
.panel-heading .fa{transition:transform 0.3s ease;transform:rotate(-45deg);padding:5px;color:#556af1;}.panel-heading:not(.collapsed) .fa{transform:rotate(0deg);}.question-container{border-radius:6px;border:solid 1px var(--main-border-color);overflow:hidden;border-bottom:solid 0px rgba(50,50,50,0);}.question{cursor:pointer;position:relative;margin-bottom:10px;padding:2.5rem 4rem;margin-bottom:0;border-bottom:solid 1px var(--main-border-color);}.question i{position:absolute;right:0;top:50%;transform:translateY(-50%);}.question.active i.fa.fa-plus{display:none;}.question.active i.fa.fa-minus{display:inline-block;}.answer.active{display:unset;background-color:var(--focus-color);flex:1 1 auto;min-height:1px;color:#fff !important;padding:2.5rem 4.5rem;display:block;}@keyframes bounce{0%{transform:scaleY(0.3);background-color:green;}50%{transform:scaleY(1);background-color:orange;}100%{transform:scaleY(0.3);background-color:green;};}.tab2_content.active{display:block;}.tab2_content.active{display:block;}#accordionhelp-content{margin-bottom:20px;}.tab-container{width:80%;margin:auto;}.tabs{display:flex;cursor:pointer;padding:20px 0;}.tab{padding:10px 15px;transition:background-color 0.3s;border-radius:10px;background:var(--muted-bg-color);margin:0px 5px;font-size:14px;}.tab.active{color:#fff;background-color:#556af1;transform:scale(1.05);box-shadow:0 6px 12px rgba(0,0,0,0.3);transition:all 0.3s ease;}.tab-content{position:relative;overflow:hidden;}.tab2_content{display:none;}.button{display:inline-block;padding:10px 20px;font-size:16px;font-weight:bold;text-align:center;text-decoration:none;cursor:pointer;border:none;border-radius:5px;background-color:#556af1;color:#fff;box-shadow:0 4px 8px rgba(0,0,0,0.2);transition:all 0.3s ease;}.button:hover{background-color:#3e53c4;box-shadow:0 6px 12px rgba(0,0,0,0.3);}
😉 阿里云产品年付99元续费99元热卖,戳我领取!
THE END
暂无评论内容