如何讓 Markdown 圖片居中

Markdown 是一種輕量級標記語言，被廣泛應用於文檔撰寫和博客寫作。在 Markdown 中，插入圖片是非常常見的操作，但是很多人在插入圖片時發現，無法居中對齊，略顯遺憾。下面我們就來談一談如何讓 Markdown 圖片居中顯示。

一、使用HTML標籤實現圖片居中

為了讓圖片居中顯示，我們可以使用 HTML 中的居中標籤，例如使用<center></center>將圖片包含起來，就可以實現圖片居中顯示了。具體的代碼示例如下：

<center>
    <img src="example.jpg" alt="example">
</center>

運行結果如下：

在上面的代碼中，我們首先使用 <center></center> 標籤將圖片包含起來，然後在其中使用 <img> 標籤插入圖片。注意，這種方法在 HTML 中是被廢棄的，但在 Markdown 中還可以使用。

二、使用CSS樣式實現圖片居中

除了使用 HTML 中的居中標籤，我們還可以使用 CSS 樣式來實現圖片居中。具體來說，可以使用 text-align 屬性，將其設置為 center，就可以讓圖片居中了。代碼示例如下：

在 CSS 中指定樣式：
.center {
    text-align: center;
}

在Markdown中插入圖片：
![](example.jpg){: .center}

運行結果如下：

我們首先在 CSS 中定義了名為 .center 的類名，將 text-align 屬性設置為 center，表示要將其中的內容居中。然後在 Markdown 中插入圖片時，使用{: .center} 將 .center 類名應用於圖片，即可實現圖片居中。

三、使用特定的 Markdown 解析器實現圖片居中

除了上面提到的方法，還有一些特定的 Markdown 解析器支持自定義語法，可以實現圖片居中。例如 kramdown 和 Pandoc。

在 kramdown 中插入居中圖片的語法為：

<div align="center">
    <img src="example.jpg" alt="example">
</div>

在 Pandoc 中插入居中圖片的語法為：

![example](example.jpg){width=50% #fig:example}

需要注意的是，這些語法只在特定的解析器中適用，如果使用其他解析器可能無法生效。

四、總結

本文詳細介紹了多種讓 Markdown 圖片居中的方法，包括使用HTML標籤、CSS樣式和特定的 Markdown 解析器。以上三種方法都可以幫助我們實現圖片居中的效果，讀者可以根據自己的喜好和習慣來選擇最適合自己的方法。