css實現圖片橫向排列滾動效果

本文主要主要介紹css實現圖片橫向排列滾動效果,需要的朋友可以參考下，希望能協助到打大家。

具體代碼如下所示：

.imageList{        overflow-x: auto;        overflow-y: hidden;        height:180px;        white-space: nowrap;      img{        width:auto;        height:100%;        margin-right:10px;      } }

<p class="imageList">    <img src="1.jpg"/>    <img src="2.jpg"/>    <img src="3.jpg"/>    <img src="4.jpg"/>    <img src="1.jpg"/></p>

這裡注意，img標籤不能左浮動，外層容器必須加不換行

white-space: nowrap;