我正在做一个网站,每月发表文章的问题。这很简单,我认为使用Markdown编辑器(如Stack Overflow中的WMD)将是完美的。
然而,他们确实需要在给定的段落中使图像右对齐的能力。
我看不出在目前的体制下有什么办法能做到这一点——有可能吗?
我正在做一个网站,每月发表文章的问题。这很简单,我认为使用Markdown编辑器(如Stack Overflow中的WMD)将是完美的。
然而,他们确实需要在给定的段落中使图像右对齐的能力。
我看不出在目前的体制下有什么办法能做到这一点——有可能吗?
当前回答
这对我很有用
<p align="center">
<img src="/LogoOfficial.png" width="300" >
</p>
其他回答
为了使图像稍微缩进一点,只需在img元素中使用一些不间断的空格。例如: <img src="https://user-images.githubusercontent.com/123456/123456789-3aabedfe-deab-4242-97a0-a6641e675e68.png" />
嵌入CSS是不好的:
![Flowers](/flowers.jpeg)
CSS在另一个文件:
img[alt=Flowers] { float: right; }
更简洁的方法是将p#给定的img {float: right}放在样式表中,或者放在<head>中并包装在样式标签中。然后,只需使用markdown ![Alt text](/path/to/img.jpg)。
我喜欢超级懒地用垂直管道(|)语法使用表格来对齐图像。这是支持一些Markdown口味(也支持纺织,如果这浮动你的船):
| I am text to the left | ![Flowers](/flowers.jpeg) |
or
| ![Flowers](/flowers.jpeg) | I am text to the right |
这不是最灵活的解决方案,但它适合我的大多数简单需求,易于阅读的markdown格式,你不需要记住任何CSS或原始HTML。
在警告框内,将图像和文本作为单个块中的段落的一部分并排对齐。
<div class="warning" style='background-color:#EDF2F7; color:#1A2067; border-left: solid #718096 4px; border-radius: 4px;'>
<p style='padding:0.7em; margin-left:0.7em; display: inline-block;'>
<img src="typora_images/image-20211028083121348.png" style="zoom:70%; float:right; padding:0.7em"/>
<b>isomorphism</b> → In mathematics, an isomorphism is a structure-preserving mapping between two structures of the same type that can be reversed by an inverse mapping.<br>
</p>
</div>
输出: