博客评论区优化

拯救“瞎眼”评论区 —— 麋鹿鲁哟主题 CSS 护眼补丁

首先声明并感谢 麋鹿鲁哟 博主，主题来自大神，整体体验很棒！
本文仅针对评论区阅读体验做小修小补，如果你也被字小、色浅、透明背景折磨到眼瞎，欢迎直接抄作业。

---

改造前后对比

改造前	改造后
背景全透、字细色浅、对比度低	白底黑字、16 px、500 字重，头像保留

一句话：牺牲少许“仙气”，换来“不瞎”。

---

快速上手（3 步）

1. 进入博客园后台 → 设置 → 页面定制 CSS。
2. 把滚动条拉到最底部。
3. 复制下方代码 → 粘贴 → 保存 → Ctrl + F5 强刷生效。

---

护眼补丁代码

/* ===== 评论区高对比度护眼版 ===== */
.feedbackCon {
    color: #000 !important;
    background: #ffffff !important;
    border-radius: 8px;
    padding: 18px !important;
    margin-bottom: 18px !important;
    line-height: 1.8 !important;
    font-size: 16px !important;
    border: 3px solid #e2e8f0 !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2) !important;
    font-weight: 500 !important;
    text-shadow: none !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

.blog_comment_body {
    color: #000 !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
    font-weight: 500 !important;
    letter-spacing: 0.2px !important;
    text-shadow: none !important;
}

/* 头像保留 */
.comment-avatar {
    display: block !important;
    width: 48px !important;
    height: 48px !important;
    border: 1px solid #dcd6b3 !important;
    padding: 3px !important;
    border-radius: 50% !important;
    float: left !important;
    margin-right: 15px !important;
    transition: transform .5s;
}
.comment-avatar:hover {
    transform: rotateZ(360deg) !important;
}

/* 楼主张显 */
.louzhu {
    background: linear-gradient(135deg, #ff6b6b, #ee5a24) !important;
    color: #fff !important;
    padding: 3px 10px !important;
    border-radius: 15px !important;
    font-size: 12px !important;
    font-weight: bold !important;
}

---

还能再调？

需求	改法
字号再大	font-size: 18px !important;
字再黑	color: #111 !important;
圆角变小	border-radius: 4px !important;

---

结语

“仙气”与“护眼”不可兼得时，我选后者。
如果你也折腾出更好看的配色，欢迎来评论区反向种草！

再次感谢麋鹿鲁哟大神，让博客园也能拥有高颜值。
本文补丁仅作个人记录与分享，眼不瞎就是胜利 ✌️