如何居中图像

学习如何使用 CSS 将图像居中。

居中图像：

Tulip

如何居中图像

第一步 - 添加 HTML：

<img src="paris.jpg" alt="Paris" class="center">

第二步 - 添加 CSS：

要使图像居中，请将左右外边距设置为 auto，并将其设置为块元素：

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

亲自试一试

请注意，如果宽度设置为 100%（全角），则无法居中。

相关页面

教程：CSS 图像