在固定大小DIV层插入N个图片使其一行排列
导读：收集整理的这篇文章主要介绍了在固定大小DIV层插入N个图片使其一行排列，觉得挺不错的，现在分享给大家，也给大家做个参考。 如何在固定大小的DIV层插入N多个图片，使其一行排列，超出层宽时出现滑动条？ 原以为利用overflow属性...
收集整理的这篇文章主要介绍了在固定大小DIV层插入N个图片使其一行排列，觉得挺不错的，现在分享给大家，也给大家做个参考。 如何在固定大小的DIV层插入N多个图片，使其一行排列，超出层宽时出现滑动条？ 原以为利用overflow属性可以实现，但是测试失败。后来利用div层叠实现了效果。
HTML代码：
复制代码@H_360_10@代码如下:
!-- 如何在固定大小的DIV层插入N多个图片，使其一行排列，超出层宽时出现滑动条？ -->
!DOCTYPE html>
html>
head>
meta http-equiv="content-type" content="text/html; charset=utf-8">
/head>
body>
div class="div">
div class="div1"> img src="test1.jpg"> /div>
div class="div2"> img src="test2.jpg"> /div>
div class="div3"> img src="test3.jpg"> /div>
/div>
/body>
/html>
css控制样式：
复制代码代码如下:
.div{
width:400px;
height:200px;
overflow-y:hidden; /*只出现水平滚动条*/
posITion: absolute;
}
.div1{
position:absolute;
z-index:1;
}
.div2{
position:absolute;
z-index:5;
left:200px;
top:0px
}
.div3{
position:absolute;
z-index:10;
left:400px;
top:0px
}
效果：
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： 在固定大小DIV层插入N个图片使其一行排列
本文地址： https://pptw.com/jishu/584984.html