Question

所以，我需要彼此相邻拍摄2张图像，但是居中。我已经弄清楚如何使图像居中，但不知道如何使其中两个居中。问题出现在display: block;的CSS中，而display: inline-block;不起作用 - 就像它只是内联一样。

我的代码居中一张图片：

CSS：

img     {
        margin: 0px auto;
        display: block;
        }

HTML：

<h1>This Week's Photo Features</h1>
    <img src="images/photos/BarcelonaGraffiti.jpg">
    <img src="images/photos/BoulderButterfly.jpg">

Answer 1

使用CSS。

＆＃13;

<div style="text-align:center">
  <img src="images/photos/BarcelonaGraffiti.jpg">
  <img src="images/photos/BoulderButterfly.jpg">
</div>

＆＃13;

Answer 2

以前的答案或多或少是正确的，一种解决方案是将图像放在容器中并使容器居中：

div {
  margin: 0 auto;
  width: 220px; 
}

这是一个更好地展示的小提琴：

Answer 3

将两个图像放在一个容器中，并将该容器放在这个中心

<div align="center">
<img src="images/photos/BarcelonaGraffiti.jpg">
<img src="images/photos/BoulderButterfly.jpg">
</div>

您几乎可以使用任何您喜欢的容器。