
免费领流量卡 | 广告招租 |
前言
一个网站做的好与不好,其中一个条件就是网站的互动,如果与网友互动频繁,这个网站的忠实程度应该不会差,很多好的网站网友留言互动频率非常高,那评论留言编辑区肯定是使用频率比较高的了,今天分享给大家一个美化教程,在评论区添加背景图片。
效果图
![图片[1] - 子比主题美化 – 给评论框加上好看的右侧背景图片 - 狐狸资源网](https://www.foxccs.com/wp-content/uploads/2024/08/image-35.png)
代码部署
在主题设置 - 自定义CSS样式
,添加下面的CSS代码:
说明:图片自己保存到本地,图片大小(162 X 75,建议透明的png图片),自己添加喜欢的背景图片
/*评论背景图*/
textarea#comment {background-color:transparent;background:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),url(https://vip.helloimg.com/images/2023/12/24/o7YHzR.png) right 10px bottom 10px no-repeat;-moz-transition:ease-in-out 0.45s;-webkit-transition:ease-in-out 0.45s;-o-transition:ease-in-out 0.45s;-ms-transition:ease-in-out 0.45s;transition:ease-in-out 0.45s;}
textarea#comment:focus {background-position-y:789px;-moz-transition:ease-in-out 0.45s;-webkit-transition:ease-in-out 0.45s;-o-transition:ease-in-out 0.45s;-ms-transition:ease-in-out 0.45s;transition:ease-in-out 0.45s;}
/*评论背景图*/
搜索url 修改()里的背景图链接
多款好看的背景图
图片储存在图床,请保存到本地上传使用,避免失效
遇到太大的图片,显示不全,可以自行修改图片高度为75像素
资源下载

© 版权声明
免责声明:本站采用CC BY-NC-SA 4.0协议,完整转载请注明来自狐狸资源网
THE END
暂无评论内容