我想在特定帖子中创建一个活动的彩色按钮（不是图片）

开发
1

您好。我不会编程。我想在特定帖子中创建一个活动的彩色按钮（不是图片）。应该在帖子编辑器窗口中写入什么代码。
这是我想要的 :point_down:


我在帖子编辑器窗口中尝试编写的代码 :point_down: :see_no_evil:

image
image1170×1031 52.6 KB

请有人帮忙。请展示正确的代码 :pray: :pray: :pray:

2

看看这个：

3 个赞
3

据我所知，我无法将按钮代码添加到编辑器窗口，因为它无论如何都不会起作用。
据我所知，我无法将按钮代码添加到编辑器窗口，也无法设置特定帖子的背景，因为它无论如何都不会起作用。我是否需要先将某些代码添加到 HTML 白名单？

如果我有什么误解，请原谅 :pray:，我不是编程专家，英语也不好。我现在正在使用谷歌翻译。

4

一张图片胜过千言万语 :slight_smile:

image
image2498×1440 183 KB

[data-theme-button] a {
        display: inline-block;
        padding: 20px 50px;
        background: #24E927;
        border-radius: 5px;
        border: 3px solid #004E7D;
        color: #004E7D;
}

如果您想居中按钮：

[data-theme-button] {
    display: flex;
    justify-content: center;
    a {
        padding: 20px 50px;
        background: #24E927;
        border-radius: 5px;
        border: 3px solid #004E7D;
        color: #004E7D;
    }
}

image
image901×462 13.8 KB

1 个赞
5

太棒了，这真是太神奇了 :exploding_head:。非常感谢 :+1: :+1: :+1:

看来我明白了如何制作不同按钮选项的逻辑。
明天我会和你分享我的代码实验。

与此同时，我想再问一个问题：将按钮对齐到帖子右侧边缘的命令是什么？

再次感谢 :raised_hands:

6

是否可以在 CSS 中编码文本大小和粗细？

7 
[data-theme-button] {
    display: flex;
    justify-content: end;
    a {
        padding: 20px 50px;
        background: #24E927;
        border-radius: 5px;
        border: 3px solid #004E7D;
        color: #004E7D;
    }
}

是的：使用以下属性：

font-size 和 font-weight

以及所需的值。

文档：

:information_source: 我更新了我消息中的 CSS 代码，使其更简洁（使用 flexbox 属性而不是 margin 来对齐按钮）。

2 个赞
8

非常感谢。您的回答对我非常重要。我正在学习。

1 个赞
9

请注意，虽然在这里偶尔询问一些关于调整网站的细节是可以的，但严格来说，基本的 CSS 和 HTML 问题最好还是在专门的论坛上提问。

3 个赞
10

当我尝试根据您的示例更新代码时，我遇到了一个错误。

image
image925×642 58.6 KB

但是当我删除了第二个字符“}”时，错误就消失了。

image
image519×357 33.1 KB

我做得对吗？

11

你好。我是否正确理解了“专用论坛”，它与 discourse 无关。或者 discourse 有一个单独的论坛来讨论 CSS 和 HTML 问题。（我不确定我的浏览器翻译是否正确）

12

抱歉我的鲁莽 :pray: 您能用我的 CSS 示例给我展示一下吗？ :pray:

附言：随着话语的深入，我开始探索编码的世界 :sweat_smile:

13

是的，抱歉，我复制代码时出错了。:+1:

他说，询问与 Discourse 无直接关系的通用 CSS 问题（例如如何使用 CSS 更改文本大小或粗细）不应该在 meta.discourse.org 上讨论，而应该在可以学习和提问 CSS 的其他地方讨论。

如果您有一个关于如何使用 CSS 在 Discourse 中执行特定操作的精确问题，那么 meta.discourse.org 是合适的。

我建议您学习 CSS 基础知识。在您喜欢的搜索引擎上用您自己的语言输入“CSS 教程”，并尝试从这里获取一些可以开始的知识。这将极大地帮助您以后自定义 Discourse 论坛的样式。

2 个赞
14

你好，谢谢，现在清楚了！
我一定会使用你提供的链接 :+1: