用Z-index解决不了弹出框的问题啊?

Question

*{ margin: 0; padding: 0;}.box1{ position: relative;left: 0;top: 0; z-index:10;}.hide{ width:50px; height: 30px; border: 1px solid black; text-align: center; line-height: 30px; position: absolute;left: 10px;top: 0px; z-index: 99;}.box{ width: 500px; height: 300px; border: 1px solid blue; position: absolute;left: 10px;top:30px; z-index:-10000; display: none;}.box1:hover .hide{ border-bottom:none;}.box1:hover .box{ display: block;}.bbb{ position: relative;}html<div class="box1"> <div class="hide">弹出</div> <div class="box">弹出框</div> </div>

Answer 1

因为你没有设置背景颜色，默认是透明的。

设置background:#fff;