使用Markdown，我如何將圖像及其標題居中？

Question

我想結束了：

Hello there! 

     <image> 
     This is an image 

Hi! 

在圖像和文本This is an image在頁面上居中。我如何用Markdown來完成這項工作？

編輯：請注意，我正在尋找水平中心的圖像和文字在頁面上。

Answer 1

您需要一個具有定義高度的塊容器，line-height和vertical-align：middle相同的值; 它應該工作。

Hello there ! 

<div id="container"> 
    <img /> 
    This is an image 
</div> 

Hi ! 

#container { 
    height:100px; 
    line-height:100px; 
} 

#container img { 
    vertical-align:middle; 
    max-height:100%; 
} 

Answer 2

我想我只是想用水平對齊任何東西來使用HTML。

所以我的代碼是這樣的：

Hello there! 

     <center><img src="" ...></center> 
     <center>This is an image</center> 

Hi! 

Answer 3

如果您正在使用kramdown，你可以做到這一點

Hello there! 

{:.center} 
![cardinal](/img/2012/cardinal.jpg) 
This is an image 

Hi! 

.center { 
    text-align: center; 
} 

Answer 4

在Mou（也許化身），這是很簡單的。

-> This is centered Text <- 

所以考慮到這一點，你可以將它應用於img語法。

->![alt text](/link/to/img)<- 

此語法並不僅僅實現上的是什麼Daring Fireball記錄降價的實施工作。

Answer 5

隨着kramdown（由githubpages使用）

{: style="text-align:center"} 
That is, while there is value in the items on 
the right, we value the items on the left more. 

，或利用@我覺得我有這應該工作給予你可以定義CSS的解決方案的響應（史蒂芬竹）

{:.mycenter} 
That is, while there is value in the items on 
the right, we value the items on the left more. 

<style> 
.mycenter { 
    text-align:center; 
} 
</style> 

Answer 6

，並且不需要任何擴展。首先您的降價圖片代碼：

![my image](/img/myImage.jpg#center) 

請注意添加的網址hash #center。

現在CSS

img[src*='#center'] { 
    display: block; 
    margin: auto; 
} 

添加此規則，你應該能夠使用URL的哈希像這樣幾乎就像定義一個類名。