如何在html让图片重叠_随笔

有两种方式；

①：一张作为背景，一张用<img/>图片标签，如：

</div>

②：两张图片都用<img />标签，用绝对位置定位，利用z-index属性控制其上下层关系，z-index的值越大，就越上如：

</div>

align="left" 有这种用法吗？

首先图片一般在设置大小的。

像你这种用position:absolute图片是相对浏览器的位置定位的。这几个图片都是相对浏览器定位的。分别距浏览器的左边为150px370px590px如果图片的宽度>210px那么图片是会重叠的。

最好的方法是浮动解决，不要使用绝对定位。

比如：img{float:leftmargin:5px}

使用伪类样式，设置div的属性position为absolute，

还有属性 z-index:1这个属性设置在层叠里的第几个层

代码如下：

<!--

#Layer1 {

position:absolute

background-color:#0066FF

left:55px

top:26px

width:383px

height:291px

z-index:1

}

#Layer2 {

position:absolute

background-color:#FF0000

left:104px

top:57px

width:250px

height:218px

z-index:2

left: 58px

}

-->

</style>

<body>

</body>

欢迎分享，转载请注明来源：内存溢出

如何在html让图片重叠