如何在 CSS 中将同一图像类的多个副本彼此相邻放置？

Question

我正在尝试制作一个飞扬的鸟类型游戏，页面底部会有一排相同的尖峰。 我将尖峰的图像复制并粘贴了 20 次，但现在我想使用 CSS 将所有尖峰图像彼此相邻放置并位于页面底部。 有谁知道如何做到这一点？

    <img class = 'spike1' src = 'spike.png'>

Answer 1

使用显示弹性？

 .spikes { display: flex } .spikes img { height: 50px; width: 50px }

 <div class="spikes"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> <img src="spike.png"> </div>