博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
问题:如何在固定大小的DIV层插入N多个图片
阅读量:6156 次
发布时间:2019-06-21

本文共 770 字,大约阅读时间需要 2 分钟。

这是贴友问的一个问题,具体需求是:

如何在固定大小的DIV层插入N多个图片,使其一行排列,超出层宽时出现滑动条?

原以为利用overflow属性可以实现,但是测试失败。后来利用div层叠实现了效果。

HTML代码:

1: 
2: 
3: 
4: 
5: 
6: 
7: 
8:    
9:         
10:         
11:         
12:    
13: 
14: 

css控制样式:

1: .div{
2:        width:400px;
3:        height:200px;
4:        overflow-y:hidden;  /*只出现水平滚动条*/
5:        position: absolute;
6:    }
7:    .div1{
8:        position:absolute;
9:        z-index:1;
10:    }
11:    .div2{
12:        position:absolute;
13:        z-index:5;
14:        left:200px;
15:        top:0px
16:    }
17:    .div3{
18:        position:absolute;
19:        z-index:10;
20:        left:400px;
21:        top:0px
22:    }

效果:

来源:

转载于:https://www.cnblogs.com/ido321/p/3983818.html

你可能感兴趣的文章
数据库之MySQL
查看>>
2019/1/15 批量删除数据库相关数据
查看>>
数据类型的一些方法
查看>>
Webpack 2 中一些常见的优化措施
查看>>
移动端响应式
查看>>
js中var、let、const的区别
查看>>
简洁优雅地实现夜间模式
查看>>
react学习总结
查看>>
在soapui上踩过的坑
查看>>
MySQL的字符集和字符编码笔记
查看>>
ntpd同步时间
查看>>
must implement java.io.Serializable hessian
查看>>
Microsoft Licenses Flash Lite for Windows Mobile Users
查看>>
HDOJ 2020 绝对值排序
查看>>
HDOJ/HDU 2560 Buildings(嗯~水题)
查看>>
Maven编译时跳过Test
查看>>
Spring Boot 整合Spring Security 和Swagger2 遇到的问题小结
查看>>
[20170628]12C ORA-54032.txt
查看>>
linux运维人员的成功面试总结案例分享
查看>>
Windows DHCP Server基于MAC地址过滤客户端请求实现IP地址的分配
查看>>