HTML 中的居中

在 HTML 中，我們可以通過(guò)使用 CSS 樣式來(lái)控制元素的居中對(duì)齊。有兩種方法可以實(shí)現(xiàn)居中：水平居中和垂直居中。

水平居中

可以使用 屬性將元素水平居中。該屬性的值可以是：

left： 將元素左對(duì)齊

center： 將元素居中對(duì)齊

right： 將元素右對(duì)齊

例如，要水平居中一個(gè)段落，可以使用以下代碼：

<code class="html"><p style="text-align: center;">水平居中的段落</p></code>

垂直居中

要垂直居中一個(gè)元素，可以使用 屬性。該屬性的值可以是：

top： 將元素頂部對(duì)齊

middle： 將元素垂直居中對(duì)齊

bottom： 將元素底部對(duì)齊

例如，要垂直居中一個(gè)圖像，可以使用以下代碼：

<code class="html"><img  src="image.jpg"   style="max-width:90%" alt="html中的居中怎么寫" ></code>

還可以使用以下 CSS 規(guī)則來(lái)同時(shí)實(shí)現(xiàn)水平和垂直居中：

<code class="&lt;a style='color:#f60; text-decoration:underline;' href=" https: target="_blank">css"&gt;.centered {
  text-align: center;
  vertical-align: middle;
}</code>

將此類應(yīng)用到元素將使其同時(shí)水平和垂直居中。