如何在 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>