Question

我在stackit markdown编辑器中写了一篇文章。如何将上传的图像集中在文档中？

此外，如何控制文本对齐，而不仅仅是图像？我在论坛中阅读了其他一些问题，但我担心给出的答案对这个特定的编辑器不起作用。

Answer 1

中所述

如果没有html和css，
native markdown不支持文本对齐。

这是我尝试过的，它在StackEdit上完美运行

<p style="text-align: center;">
Para centered
</p>
<p style="text-align: left;">
Para left
</p>
<p style="text-align: right;">
Para right
</p>

对于图像对齐，我已经使用img标记测试了左右对齐，如下所示：

<img style="float: right;" src="whatever.jpg"> </img>
<img style="float: left;" src="whatever.jpg"> </img>

它们都完美无缺，但style = "float: center;"不起作用

Answer 2

而且，作为降价的一部分，stackedit.io似乎并不支持对齐。看起来任何style属性似乎都会在显示时被清除，因此float: left和float: right将无效。似乎有一些解决方法。

您基本上必须在使用已弃用的标记/属性或使用stackedit.io定义的类之间进行选择。不能保证这些类在将来不会被改变，尽管它们中的大多数都是如此标准，以至于它们不太可能。

左右对齐图片

正如@ imran-ali所提到的，您可以使用img align标记：

<img align="left" src="https://www.gravatar.com/avatar/a6596d9955d2df59402c150f699bc8b8?s=32&d=identicon&r=PG&f=1" style="float:right"></img> Some text which should appear to the right of the image.

但是，与<center>标记一样，HTML5中已弃用align属性，您应该避免使用它们。

您还可以尝试使用其标记所使用的某些样式，因为class属性似乎无法清除。

<img class="pull-left" src="https://www.gravatar.com/avatar/a6596d9955d2df59402c150f699bc8b8?s=32&d=identicon&r=PG&f=1" style="float:right"></img> Some text which should appear to the right of the image.

如果您想将图片右侧对齐，只需将align="left"或class="pull-left"与align="right"或class="pull-right"交换。

注：

图像仍然位于文本之前，即使您要将其对齐也是如此。
图像需要与降价编辑器中的文本位于同一行...否则会在图像和文本之间放置换行符。

居中图片

我能弄明白的唯一两种方法，并不理想。再次，您可以从piggyit.io display css（ center-block 类）中捎带：

<img class="center-block" src="https://www.gravatar.com/avatar/a6596d9955d2df59402c150f699bc8b8?s=32&d=identicon&r=PG&f=1"></img>

或者您可以使用<center>标记，如前所述，该标记已被弃用。

在stackedit.io中居图像

2 个答案: