html中将图片横排排列的代码

HTML中，将多张图片横排排列可以通过以下代码实现：

<div>
    <img src="image1.jpg" style="float:left;" />
    <img src="image2.jpg" style="float:left;" />
    <img src="image3.jpg" style="float:left;" />
</div>

以上代码中，每个图片都设置了float:left;属性，使得多张图片能够水平放置在同一行。

此外，我们还可以通过Box-sizing属性来确定图片占的空间大小，避免不同尺寸的图片无法排列在同一行中。

<div style="Box-sizing:border-Box;">
    <img src="image1.jpg" style="float:left; width:33.3%; Box-sizing:border-Box;" />
    <img src="image2.jpg" style="float:left; width:33.3%; Box-sizing:border-Box;" />
    <img src="image3.jpg" style="float:left; width:33.3%; Box-sizing:border-Box;" />
</div>

以上代码中，我们通过设置每张图片的宽度为33.3%，并设置Box-sizing:border-Box;属性，使得每个图片包含了padding和border后占据的空间大小保持一致，从而保证了图片的横排效果。