[分享]css两个图片一行

CSS可以帮助我们实现很多视觉效果，比如让两个图片横向排列在同一行。

/* CSS代码 */
.img-container {
  display: flex;
  justify-content: space-between;
}
.img-container img {
  max-width: 45%;
} 

如上代码，我们使用了flex布局，通过设置容器的 justify-content: space-between 属性，让两张图片之间保持空隙，并将它们靠左和靠右对齐。同时，.img-container img 选择器中设置 max-width: 45%，让图片的宽度最大为容器的45%。

HTML代码如下：

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

将两张图片放在同一个容器中，容器就是上面的 .img-container。图片可以使用 <img> 标签加载。

使用以上CSS和HTML代码，就可以将两张图片排列在同一行了。当然，也可以使用其他方法实现横向排列，比如使用浮动、inline-block等。