css完成照片横向排序翻转实际效果

2021-03-18 03:12 jianzhan

实际编码以下所示:

.imageList{
        overflow-x: auto;
        overflow-y: hidden;
        height:180px;
        white-space: nowrap;
      img{
        width:auto;
        height:100%;
        margin-right:10px;
      }
 }
<div class="imageList">
    <img src="1.jpg"/>
    <img src="2.jpg"/>
    <img src="3.jpg"/>
    <img src="4.jpg"/>
    <img src="1.jpg"/>
</div>

这里留意,img标识不可以左波动,外层器皿务必加不换行

white-space: nowrap;

总结

以上所述是网编给大伙儿详细介绍的css完成照片横向排序翻转实际效果,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!