CSS中图片堆叠次序设置：
概念解释：
通过简单的案例演示：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>照片堆</title> <style type="text/css"> div { width:800px; height:500px; background-color: #600; margin: 50px auto; position:relative; } #i1 { position: absolute; left:300px; top:100px; } #i2 { position: absolute; left:200px; top:70px; } #i3 { position: absolute; left:400px; top:150px; } /* 堆叠顺序 */ img:hover { z-index:999;/* 值越大图片越在最上面 */ } </style> </head> <body> <div> <img alt="" src="../images/1.jpg" id="i1"> <img alt="" src="../images/2.jpg" id="i2"> <img alt="" src="../images/3.jpg" id="i3"> </div> </body> </html>最终页面显示效果：
