缩进段落文本？

支持
1

我感觉自己像个白痴，但我就是弄不明白为什么这不起作用：

<div style="margin-left: 20px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

结果是：

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

明显没有缩进！

肯定有某种方法可以支持文本缩进吧，即使它因为某种原因不那么明显，对吧？

2

如果我需要缩进任何内容，我会使用几个   ，但这只对第一行有效。

1 个赞
3

但这只会影响段落的第一行

1 个赞
4

我感觉就在舌尖上。:slightly_smiling_face:

编辑： 我把在列表项中添加四个空格以保持对齐混淆了。

我确实发现你可以用 <ul> </ul> 包裹一段文本，这样就可以缩进。虽然有点 hacky，但如果你无法访问管理员设置来创建下面的包装解决方案，可能会有用。

例如。

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
1 个赞
5

我敢肯定，四个空格在 Markdown 中是一个代码块。

1 个赞
6

Discourse 仅允许某些 HTML 标签和属性。我猜他们会完全阻止 style 属性，因为它基本上是全能的。

1 个赞
7

我们的网站设置中是否可以允许更多标签/属性？

8

我在站点设置中看不到任何内容，但也许您可以使用插件。我发现了两个提及 HTML 标签的文件，可能值得一看。我个人认为允许 style 属性会很危险。

1 个赞
9

我认为 div style 未被列入白名单，您需要一个插件或组件。但是，您可以直接在管理员论坛中创建包装 bbcode。在“自定义”>“您的主题或组件”>“CSS Common”中添加以下行：

[data-wrap="indent"] {
    margin-left: 20px;
}

然后，在您的帖子中使用以下内容来格式化您想要的文本：

[wrap="indent"]
您的段落
[/wrap]
9 个赞
10

我不知道你能这样做。我在论坛上使用了带有 data-theme 属性的 span：

image
image372×172 4.02 KB

（你可以在这里看到它：https://unicyclist.com/t/schlumpf-hub-serial-numbers-reference/106130）

[wrap] 的方式有任何不同吗？我们可以用它来进行内联样式吗？
还有其他方法可以自定义帖子样式吗？

1 个赞
11

既然我们使用了 div 元素，我们可以自定义很多东西，但对于行内样式，我认为你的选择是最好的。

我不确定是否还有很多现成的选项。当我经常使用某个功能时，我会使用一个插件或组件来创建一个 div 类或 bbcode，并在工具栏中添加一个图标。

12

一个简单的问题……怎么做？

13

您可以使用我的主题组件作为示例：

您有两种选择，将图标添加到工具栏或齿轮菜单中

image
image485×241 3.13 KB

工具栏：

api.onToolbarCreate(toolbar => {
    toolbar.addButton({
        id: "align_justify_button",
        group: "extras",
        icon: "align-justify",
        perform: e => e.applySurround('[wrap="justify"]\n', '\n[/wrap]', 'align_justify_text')
    });
});

齿轮菜单

api.addToolbarPopupMenuOptionsCallback(() => {
  return {
      action: "floatleft",
      icon: "indent",
      label: "float_left_button"
  };
});

您可以通过插件获得一些额外的选项，但组件应该足够了：GitHub - MonDiscourse/discourse-formatting-toolbar: Add formatting options on your post (center, align to right, justify a text, etc.)

5 个赞