加入收藏 | 设为首页 | 会员中心 | 我要投稿 焦作站长网 (https://www.0391zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 服务器 > 系统 > 正文

css实现图片横向排列滚动效果

发布时间:2020-03-12 16:08:46 所属栏目:系统 来源:站长网
导读:这篇文章主要介绍了css实现图片横向排列滚动效果,需要的朋友可以参考下

.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=http://www.jb51.net/css/"1.jpg"/> <img src=http://www.jb51.net/css/"2.jpg"/> <img src=http://www.jb51.net/css/"3.jpg"/> <img src=http://www.jb51.net/css/"4.jpg"/> <img src=http://www.jb51.net/css/"1.jpg"/> </div>

css实现图片横向排列滚动效果

这里注意,img标签不能左浮动,外层容器必须加不换行

white-space: nowrap;

总结

以上所述是小编给大家介绍的css实现图片横向排列滚动效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

(编辑:焦作站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读