# 如何为类别tr添加一个类以可选地应用CSS

**URL:** <https://meta.discourse.org/t/how-to-add-a-class-to-category-tr-to-optionally-apply-css/318438>\
**Category:** Development\
**Created:** [2024年七月25日 20:55 UTC](https://meta.discourse.org/t/how-to-add-a-class-to-category-tr-to-optionally-apply-css/318438 "2024-07-25T20:55:47Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)\
**Post date:** [2024年七月25日 20:55 UTC](https://meta.discourse.org/t/how-to-add-a-class-to-category-tr-to-optionally-apply-css/318438/1 "2024-07-25T20:55:47Z")

</div>

我正在主题列表中向 `<tr>` 添加一些内容。我需要仅将 CSS 应用于我应该影响的类别。

我认为我可以通过将“can-rate”类添加到我想影响的类别的 `<tr>` 来实现这一点。

我认为我可以在我的 glimmer 组件中做到这一点（它可能知道是否应该应用更改？），尽管我同样乐意在初始化程序中完成。

我尝试了一些不起作用的事情。有人能给我一些帮助或指向一个例子吗？例如，[https://github.com/discourse/discourse-groups-css-classes-in-body/blob/main/common/header.html](https://github.com/discourse/discourse-groups-css-classes-in-body/blob/main/common/header.html) 似乎是正确的方向，但我不知道如何在初始化程序中找出类别是否是我想要更改的类别（所以我想初始化程序是错误的地方？）

也许 [Override class list](https://meta.discourse.org/t/override-class-list/166310)

---

<div class="post-metadata">

**Author:** ![Alteras](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/alteras/32/179824_2.png) [@Alteras](https://meta.discourse.org/u/Alteras)\
**Post date:** [2024年七月25日 21:34 UTC](https://meta.discourse.org/t/how-to-add-a-class-to-category-tr-to-optionally-apply-css/318438/2 "2024-07-25T21:34:10Z")

</div>

直接定位 `data-category-id` 属性可能比尝试向 `<tr>` 添加类更容易。

如果你需要在没有 `data-category-id` 的情况下向 tr 添加样式，你可能需要研究一下 Category Icons 主题组件是如何渲染分类链接的（这会影响到所有地方）。可以尝试将类/属性添加到子元素，然后使用一些 CSS 来实现样式（例如 `tr:has(> .some-class)`）。

> <https://github.com/discourse/discourse-category-icons/blob/main/javascripts/discourse/initializers/category-icons.js#L84>

---

<div class="post-metadata">

**Author:** ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)\
**Post date:** [2024年七月26日 18:06 UTC](https://meta.discourse.org/t/how-to-add-a-class-to-category-tr-to-optionally-apply-css/318438/3 "2024-07-26T18:06:38Z")

</div>

> [@Alteras](#):
>
> 类似地添加类/属性到子元素，并让样式通过一些 CSS（例如 `tr:has(>.some-class)`）来呈现。

啊哈！这就是我需要的魔法。而且如此简单。我几乎都明白了。太感谢你了。