3

Markdown里图片并列显示

 2 years ago
source link: https://blog.xpgreat.com/p/md_display_img_parallel/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

在编辑博文的时候,有时会想把两张图片并列在一起显示,参考了网上内容,分享一下。

首先记住一点,在markdown里是可以直接写html代码的。这个前提下很自然的有下面的方法:

调整图片宽度/高度:

<img src="http://xxx.jpg" title="xxx" width="100" height="100"/> 

宽度是 width,高度是 heighttitle 为图片描述。

单张居中显示:

<center>
    <img src="http://example.com/xxx.png">
</center>
<figure>
    <img src="http://xxx.jpg">
</figure> 

两张并排显示:

<figure class="half">
    <img src="http://xxx.jpg">
    <img src="http://xxx.jpg">
</figure>

三张并排显示:

<figure class="third">
    <img src="http://xxx.jpg">
    <img src="http://xxx.jpg">
    <img src="http://xxx.jpg">
</figure>

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK