z-index
当对多个元素设置定位时,重叠的定位元素可以通过z-index调整堆叠顺序 其值可以为0 正数 负数
特点 1 z-index默认值为0 取值越大 定位元素在层叠元素上越局上
2 z-index取值一样，后来居上
3 z-index值不能加单位
4 只有定位元素才有该属性，其余如浮动等都无此属性
元素的显示和隐藏
display: none; /* 隐藏元素 不是删除 只不过看不见 不保留位置*/
visibility: hidden;/*隐藏元素 它保留位置*/
06显示和隐藏二维码.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> div.content { width: 100px; height: 100px; text-align: center; line-height: 100px; background-color: rgba(0,0,0,0.4); } .wrap { position: relative; } .wrap .erweima { position: absolute; left: 100px; top: 0; display: none; } .wrap:hover .erweima { display: block; } </style> </head> <body> <div class="wrap"> <div class="content">扫二维码</div> <div class="erweima"> <img src="img/jd.png" alt=""> </div> </div> </body> </html>
