# 设置主题页面样式的正确方法

**URL:** <https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912>\
**Category:** Development\
**Created:** [2026年七月30日 12:38 UTC](https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912 "2026-07-30T12:38:32Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Damian\_Boon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/damian_boon/32/574032_2.png) [@Damian\_Boon](https://meta.discourse.org/u/Damian_Boon)\
**Post date:** [2026年七月30日 12:38 UTC](https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912/1 "2026-07-30T12:38:32Z")

</div>

大家好，我想移动这些内容，但不确定正确的方法是什么。是不是只需要创建一个组件来实现呢？

（我使用的是嵌套主题回复功能）

 ![afascac](https://global.discourse-cdn.com/meta/original/4X/8/3/3/833afa59e5ee94d82b5800b7edca66d044af66b6.jpeg)

---

<div class="post-metadata">

**Author:** ![Damian\_Boon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/damian_boon/32/574032_2.png) [@Damian\_Boon](https://meta.discourse.org/u/Damian_Boon)\
**Post date:** [2026年七月30日 14:00 UTC](https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912/2 "2026-07-30T14:00:53Z")

</div>

我通过一个组件移动了它们，但这会增加臃肿等问题吗

---

<div class="post-metadata">

**Author:** ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)\
**Post date:** [2026年七月30日 15:03 UTC](https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912/3 "2026-07-30T15:03:31Z")

</div>

你可以为 `.custom-topic-layout_bottom-bar` 添加 `justify-content: flex-end;` 🙂

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/7/2/c721da43f02fbe73de6b4c7afcc234bf7cf0ac96.jpeg)

---

<div class="post-metadata">

**Author:** ![Damian\_Boon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/damian_boon/32/574032_2.png) [@Damian\_Boon](https://meta.discourse.org/u/Damian_Boon)\
**Post date:** [2026年七月30日 22:59 UTC](https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912/4 "2026-07-30T22:59:50Z")

</div>

抱歉，我的意思是嵌套工具栏。我用一个组件实现了它，但不确定这是否是正确的方法

 ![Screenshot 2026-07-30 at 23.58.49](https://global.discourse-cdn.com/meta/original/4X/d/2/c/d2c5969f5cc3e10acde47c4bc065d3adcffcaeba.png)

---

<div class="post-metadata">

**Author:** ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)\
**Post date:** [2026年七月31日 08:16 UTC](https://meta.discourse.org/t/correct-way-to-style-the-topic-page/408912/5 "2026-07-31T08:16:09Z")

</div>

原理是一样的，你可以使用浏览器的开发者工具查看 HTML 和 CSS 代码，看看它是如何实现的。

 ![image](https://global.discourse-cdn.com/meta/original/4X/a/c/7/ac73fccd9673116437751ff480dbf45a5bd160b7.png)

我还没试过，但我觉得这个自定义设置应该能生效：

```scss
@include viewport.from(sm) {
    .nested-post__menu nav.post-controls {
        justify-content: flex-end;
    }
}

```