可以通过HTML和CSS来实现。以下是一种常见的实现方式:
<div>
标签来创建。给这个容器一个唯一的ID,例如container
。<div id="container"></div>
display: flex
来实现弹性布局,并使用flex-wrap: wrap
来实现换行。#container {
display: flex;
flex-wrap: wrap;
}
<img>
标签,分别用于显示两张图片。给这两个图片标签分别设置一个唯一的ID,例如image1
和image2
。<div id="container">
<img id="image1" src="image1.jpg" alt="Image 1">
<img id="image2" src="image2.jpg" alt="Image 2">
</div>
#image1, #image2 {
width: 50%;
height: auto;
}
以上代码将两张图片等分容器的宽度,并根据宽度自动调整高度,以保持图片的比例。
这样,两张图片就可以在容器外并排显示了。你可以将src
属性替换为你自己的图片链接,以显示你想要展示的图片。
请注意,以上代码只是一种实现方式,你可以根据具体需求进行调整和优化。
领取专属 10元无门槛券
手把手带您无忧上云