WordPress 主题美化 – 评论框添加背景图-追梦人

温馨提示：本文最后更新于2025-08-05 11:09:35，某些文章具有时效性，若有错误或已失效，请在下方留言！

AI智能摘要

阿蛮君博客分享了为WordPress评论框添加背景图的美化方法，通过自定义CSS代码实现视觉优化。代码包含设置透明背景、线性渐变叠加图片、定位与过渡动画效果，并建议将示例中的背景图URL替换为自己的图片路径，以提升网站个性化与用户体验。

— 此摘要由AI分析文章内容生成，仅供参考。

本文转自阿蛮君博客 WordPress 主题美化 – 评论框添加背景图 - 阿蛮君博客 (amjun.com)

添加如下 css，可给评论框添加背景图：

/*评论背景图*/
textarea#comment {
    background-color:transparent;
    background:linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),url(/wp-content/uploads/2023/03/comment.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;
}

背景图链接需要替换为自己的，效果如下：