WP添加底部可爱底线提示-WP教程

效果

教程

  • 在主题目录—>footer.php的“<footer class….>”上方加入以下代码:
<!--底部可爱底线提示-->
<div class="app_normal window" style="padding-top:" data-reactroot=""><div class="common_container lastpagenotice_noticewrap"><img src="填写你的链接" data-spm-anchor-id="a2ha1.14919748_WEBHOME_GRAY.0.i1"><div class="lastpagenotice_text"  style="color:#6699FF;font-weight:bold;">我是底线可爱胖!冲鸭~</div><div class="lastpagenotice_line"></div></div></div>
  • 然后在主题后台放入CSS代码
/*底部<a href="https://www.atbkw.cn/tag/%e5%8f%af%e7%88%b1"><b style="color:#0388d1">可爱</b></a><a href="https://www.atbkw.cn/tag/%e5%ba%95%e7%ba%bf"><b style="color:#0388d1">底线</b></a>提示*/
.lastpagenotice_noticewrap{color:hsla(0, 2.1%, 18.8%, 0.6);}.lastpagenotice_noticewrap img{height:73px; width:88px; margin:0 auto}.lastpagenotice_noticewrap .lastpagenotice_text{display:block; position:absolute; font-size:15px; line-height:20px; top:50%; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); left:-webkit-calc(50% + 60px); left:calc(50% + 60px)}.lastpagenotice_noticewrap .lastpagenotice_line{width:100%; height:1px; background-color:hsla(0,0%,100%,.05); position:absolute; bottom:0}.app_normal{text-align:center; position:relative}

我这边提供下好看的图

© 版权声明
THE END
喜欢就支持一下吧
点赞14 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情快捷回复

    暂无评论内容