css两张图水平居中

CSS是网页设计中必不可少的一部分，其中水平居中元素也是常用的设计技巧之一。本文将介绍如何使用CSS将两张图片水平居中。

首先，我们需要给图片添加一个容器。这个容器可以是一个div，也可以是父元素。我们选择使用div容器。代码如下：

<div class="img-container">
  <img src="image1.jpg">
  <img src="image2.jpg">
</div> 

接下来，我们需要设置容器的样式。我们使用flex布局来实现水平居中。代码如下：

.img-container {
  display: flex;
  justify-content: center;
}
.img-container img {
  margin: 0 10px; /* 可选，用于设置图片间距 */
} 

以上代码的作用是将容器的主轴方向设为水平，使图片居中显示，并可选设置图片间距。我们使用margin来设置图片间距，同时保证图片不会溢出容器。

最后，我们将上述代码应用在我们的HTML文件中，就可以看到两张图片已经水平居中了。

本文介绍了如何使用CSS将两张图片水平居中。通过添加一个容器，并使用flex布局，我们可以轻松实现这一功能。希望本文对大家有所帮助。