CoreNext主题美化 - 底部可爱底线提示“我也是有底线哒”

一个小小的美化教程,很多网站都有,就是在网页下拉到底部没有内容的时候会出现一个提示,对这个提示进行美化,也是网站使用比较多的,图片可以自行更换,使用后比较更有趣味性。

效果截图

CoreNext主题美化 - 底部可爱底线提示“我也是有底线哒”插图

安装教程

底部HTML代码

在主题目录 —>footer.php 的“<footer class….> ”上方加入以下代码:

<!--底部可爱底线提示_好软猫[www.haoruanmao.com]-->

<div class="app_normal window" style="padding-top:" data-reactroot=""><div class="common_container lastpagenotice_noticewrap"><img src="https://img.wiiuii.cn/img/lan.png" 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样式

/*底部可爱底线提示CSS_好软猫[www.haoruanmao.com]*/

.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}
好软猫温馨提示您
本文最后更新于2024-07-10,部分内容具有时效性,如有失效,请评论留言
文章没读爽?点我试试随机文章
阅读至此,本文已完结
THE END