1. 程式人生 > >Markdown 中控制圖片的大小 對齊方式

Markdown 中控制圖片的大小 對齊方式

普通展示圖片

MarkDown中顯示圖片的語法是 ![圖片描述](圖片地址) 。但是這種方法只是單純把圖片顯示出來,如果圖片很大的話就會鋪滿螢幕或者超高,排版上不好看。

普通展示

通過img標籤控制寬高

<img src="http://pic15.photophoto.cn/20100615/0006019058815826_b.jpg" height="330" width="495">

通過 <div> 標籤和 align 屬性控制對齊方式

<div align="center">

<img src="http://pp.myapp.com/ma_pic2/0/shot_42391053_1_1488499316/550" height="330" width="190" >

<img src="http://pp.myapp.com/ma_pic2/0/shot_42391053_2_1488499316/550" height="330" width="190" >

<img src="http://pp.myapp.com/ma_pic2/0/shot_42391053_3_1488499316/550" height="330" width="190" >

 </div>

其他屬性

上面2個標籤我在多個編輯器中測試都有效。

根據MarkDown編輯器解析語法的方式不同,有些編輯器還支援別的屬性

比如在 img 標籤中增加 style="margin-left:45px" ,在atom中配合GitHub MarkDown有效。

甚至相同的html屬性在不同的編輯器內展示效果也不一樣。如果想傳遞一個md檔案給別人的話, 儘量不要加別的html屬性進去,最好是測試滿意後轉換為pdf格式發給對方。