# 回复按钮在滚动/悬停时获得变亮和加粗效果

**URL:** https://meta.discourse.org/t/reply-button-getting-brightening-and-bold-effect-on-scroll-hover/397387
**Category:** Development
**Created:** [2026年三月1日 22:57 UTC](https://meta.discourse.org/t/reply-button-getting-brightening-and-bold-effect-on-scroll-hover/397387 "2026-03-01T22:57:40Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![hipp0](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hipp0/32/537433_2.png) [@hipp0](https://meta.discourse.org/u/hipp0)
#### Post date: [2026年三月1日 22:57 UTC](https://meta.discourse.org/t/reply-button-getting-brightening-and-bold-effect-on-scroll-hover/397387/1 "2026-03-01T22:57:40Z")

</div>

回复按钮成了用 CSS 修复的最难的部分。

它使回复按钮在帖子被悬停/聚焦时变亮。它还使“Reply”一词在悬停时变得更粗，这我不喜欢。

 ![image](https://global.discourse-cdn.com/meta/original/4X/2/d/3/2d3cbb4851e0ab63312fc49ebae500ac520f1372.png)

 ![image](https://global.discourse-cdn.com/meta/original/4X/a/0/9/a09e2f8277d9179fd9d5821fbce6f723a9486f7c.png)

它还在直接悬停时改变字体颜色，但只改变了图标而不是“Reply”一词，所以需要 CSS 来统一默认样式。

![image](https://global.discourse-cdn.com/meta/original/4X/c/0/1/c0175056a36db8cd1bc99aa63c7a96ad30b1e4a8.png)

> [@How to css-control the 'reply' and 'show replies' buttons?](https://meta.discourse.org/t/how-to-css-control-the-reply-and-show-replies-buttons/24946):
>
> I’m doing some css-customization on a discourse installation. Right now I’m working on a more simple thread-design. (I’ll share when finished smile) But I’m stuck on how to control the look of theese two buttons: I wan’t to make the background transparent (when not mousing-over) and I’ve tried: .nav.post-controls button.create {background: transparent;} .nav.post-controls .show-replies {background: transparent;} Which seems to work in Chrome developer tools but not when impleme…

回复按钮上有很多效果，还有某种加粗/或更重的字体被添加。

 ![image](https://global.discourse-cdn.com/meta/original/4X/f/0/2/f02155587db4251e88f1a6838d93a815b9dfd7db.png)

![image](https://global.discourse-cdn.com/meta/original/4X/c/3/b/c3ba1ece59841ad001671dc7038c113ab244b26e.png)

这是我拥有的代码，仍然有字体放大的效果，我已经设法摆脱了变亮的效果：

```plaintext
.post-info.edits .btn-flat svg,
.post-info.edits .btn-flat .d-button-label,
.topic-post .post-controls .create svg,
.topic-post .post-controls .create .d-button-label {
    fill: #7b7b7b !important;
    color: #7b7b7b !important;
 
}

/* 2. 悬停状态：更改为 e0e0e0 */
.post-info.edits .btn-flat:hover svg,
.post-info.edits .btn-flat:hover .d-button-label,
.topic-post .post-controls .create:hover svg,
.topic-post .post-controls .create:hover .d-button-label {
    fill: #e0e0e0 !important;
    color: #e0e0e0 !important;
}

/* 3. 消除变亮/发光和缓慢的过渡 */
.post-info.edits .btn-flat,
.topic-post .post-controls .create {
    opacity: 1 !important;
    filter: none !important;
    transition: none !important;
    animation: none !important;
}

/* 4. 阻止滚动高亮使颜色变淡 */
.topic-post.highlighted .post-controls .create,
.topic-post.highlighted .post-info.edits .btn-flat {
    filter: none !important;
    opacity: 1 !important;
}

```

如果你能通过某种内置样式修改图标/字体/文本，那就太好了。因为我已经写了很多 CSS 来使默认外观符合我的需求。

我之前让它看起来更好，但我不得不删除我拥有的 CSS，因为它由于双按钮和所有应用的各种样式而导致了很多问题。

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [2026年三月1日 23:09 UTC](https://meta.discourse.org/t/reply-button-getting-brightening-and-bold-effect-on-scroll-hover/397387/2 "2026-03-01T23:09:13Z")

</div>

> [@hipp0](#):
>
> 如果能通过某种内置样式来修改图标/字体/文本，那就太酷了。

你可以使用 `content: "Some text"` 来更改元素的文本。但最好还是通过站点文本来更改文本。