我正在做一个网站,每月发表文章的问题。这很简单,我认为使用Markdown编辑器(如Stack Overflow中的WMD)将是完美的。
然而,他们确实需要在给定的段落中使图像右对齐的能力。
我看不出在目前的体制下有什么办法能做到这一点——有可能吗?
我正在做一个网站,每月发表文章的问题。这很简单,我认为使用Markdown编辑器(如Stack Overflow中的WMD)将是完美的。
然而,他们确实需要在给定的段落中使图像右对齐的能力。
我看不出在目前的体制下有什么办法能做到这一点——有可能吗?
当前回答
我有同样的任务,我把我的图像向右对齐,添加了这个:
<div style="text-align: right"><img src="/default/image/sms.png" width="100" /></div>
要将图像对齐到左侧或中心,请替换
<div style="text-align: right">
with
<div style="text-align: center">
<div style="text-align: left">
其他回答
<div style="float:left;margin:0 10px 10px 0" markdown="1">
![book](/images/book01.jpg)
</div>
markdown内部的属性markdown可能性。
更简洁的方法是将p#给定的img {float: right}放在样式表中,或者放在<head>中并包装在样式标签中。然后,只需使用markdown ![Alt text](/path/to/img.jpg)。
许多Markdown“额外”处理器支持属性。所以你可以像这样包含一个类名(PHP Markdown Extra):
![Flowers](/flowers.jpeg){.callout}
或者,备用的(我的,Kramdown, Python Markdown):
![Flowers](/flowers.jpeg){: .callout}
然后,当然,您可以以正确的方式使用样式表:
.callout {
float: right;
}
如果您的文档支持这种语法,那么它将为您提供两全其美的服务:没有嵌入标记,样式表足够抽象,无需内容编辑器修改。
我有同样的任务,我把我的图像向右对齐,添加了这个:
<div style="text-align: right"><img src="/default/image/sms.png" width="100" /></div>
要将图像对齐到左侧或中心,请替换
<div style="text-align: right">
with
<div style="text-align: center">
<div style="text-align: left">
最佳和最可定制的选项:
<div style="display:flex; align-items: center;"> <div style="flex:1"> <img src="https://www.researchgate.net/profile/Jinsong-Chong/publication/233165295/figure/fig5/AS:667635838640135@1536188196882/Initial-contour-Figure-9-Detection-result-in-low-resolution-image-in-low-resolution-image.ppm"/> </div> <div style="flex:1;padding-left:10px;"> <img src="https://www.researchgate.net/profile/Miguel-Vega-4/publication/228966464/figure/fig1/AS:669376512544781@1536603205341/a-Observed-low-resolution-multispectral-image-b-Panchromatic-image-c.ppm" /> </div> </div>
这将使第一个对齐到左边,第二个对齐到右边。也适用于2张以上的图像。