# 为了隐藏剧透，请添加 \`显示剧透！\` 这样的工具提示文本。隐藏细节也类似。

**URL:** <https://meta.discourse.org/t/for-spoiler-add-tooltip-text-like-reveal-spoiler-similar-for-hide-details/170113>\
**Category:** Feature\
**Created:** [2020年十一月14日 11:05 UTC](https://meta.discourse.org/t/for-spoiler-add-tooltip-text-like-reveal-spoiler-similar-for-hide-details/170113 "2020-11-14T11:05:00Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![EricGT](https://avatars.discourse-cdn.com/v4/letter/e/f1d935/32.png) [@EricGT](https://meta.discourse.org/u/EricGT)\
**Post date:** [2020年十一月14日 11:05 UTC](https://meta.discourse.org/t/for-spoiler-add-tooltip-text-like-reveal-spoiler-similar-for-hide-details/170113/1 "2020-11-14T11:05:00Z")

</div>

我经常使用 `blur spoilers` 来回答作业问题，使用 `Hide details` 来添加那些不需要占用帖子空间的详细信息。

在查看我以前的一个 StackOverflow [回答](https://stackoverflow.com/a/55515519/1243762) 时，我注意到它现在对 spoiler 显示了一个不错的提示工具（tooltip），即：

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

众所周知，许多刚接触 Discourse 的用户并不愿意去学习 Discourse 的用法，因此我经常需要解释如何使用 spoiler：

这段文字会被模糊处理

或者隐藏详细信息：

> **摘要**
>
> 这段文字会被隐藏

如果这些功能也能带有提示工具，我会更开心。🙂

* * *

**编辑**

写这段内容时，不知为何我一时想不起“tooltip”这个名称。感谢 @merefield。

因此，我将 `overlay text` 改为了 `tooltip`。如果某些回复看起来不太对劲，请怪我。

---

<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:** [2020年十一月14日 12:05 UTC](https://meta.discourse.org/t/for-spoiler-add-tooltip-text-like-reveal-spoiler-similar-for-hide-details/170113/2 "2020-11-14T12:05:26Z")

</div>

这个 CSS 可能是一个变通方案：

```css
.spoiler-blurred {
    filter: blur(0);
    
    & > * {
        filter: blur(0.5em);
    }
    &:after {
        content: "显示剧透 ⚠";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}

```

---

<div class="post-metadata">

**Author:** ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)\
**Post date:** [2020年十一月14日 12:09 UTC](https://meta.discourse.org/t/for-spoiler-add-tooltip-text-like-reveal-spoiler-similar-for-hide-details/170113/3 "2020-11-14T12:09:15Z")

</div>

这里加一个简单的提示框可能会有帮助？我承认，目前看来并不是完全直观。如果能有一点提示引导就更好了……

没错，@canapin，那样可行 🙂 👍