给子比主题悬浮按钮自定义图片样式,并链接到文章进行阅读的美化代码-zibll美化交流分享社区-zibll子比主题-WordPress主题模板-zibll子比主题

给子比主题悬浮按钮自定义图片样式,并链接到文章进行阅读的美化代码

该帖子部分内容已隐藏
付费阅读
已售 32
100积分
此内容为付费阅读,请付费后查看

素材配图是用的星语大佬的,发这个教程是纪念一下子比美化元老级大神,星语的。

悬浮按钮添加自定义HTML

自定义css

.wiiuii-zbfc-sty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.wiiuii-zbfc-img {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
.wiiuii-zbfc-sty>a {
width: 100%;
}
.wiiuii-zbfc-btn {
color: #000;
text-align: center;
background: linear-gradient(288deg,#ffb6b9 0,#ffb6b9 35%,#fae3d9 calc(35% + 1px),#fae3d9 45%,#bbded6 calc(45% + 1px),#bbded6 65%,#61c0bf calc(65% + 1px),#61c0bf 100%);
width: 100%;
padding: 10px;
margin-top: 5px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}

更多子比功能及美化教程,可以来我的站点逛逛,超过260+子比相关教程及美化代码,绝对让你大有收获,记得收藏网址哦

 

请登录后发表评论