css三张图横排

有时候，在我们进行网页设计的时候，需要将三张图片横排在一起展示。这时候，我们可以使用CSS来实现这一效果。

下面的代码演示了如何使用CSS将三张图片横排：

 <style type="text/css">
        .img-container {
            width: 100%;
            display: flex;
            justify-content: space-around;
        }
        .img-container img {
            width: 30%;
        }
    </style>

    <div class="img-container">
        <img src="image1.jpg" alt="Image 1">
        <img src="image2.jpg" alt="Image 2">
        <img src="image3.jpg" alt="Image 3">
    </div> 

我们首先给img-container设置了100%的宽度，并且将display属性设置为flex，以便让其子元素横排。而justify-content属性的值设置为space-around，可以让子元素在容器内均匀分布。

接着，我们将img元素的宽度设置为30%，这样三张图就可以横排在一行内了。

通过上面的代码，我们就可以实现三张图片横排的效果了。