css - 有什么办法可以重叠另一个 CSS 吗？

Question

有什么办法可以重叠另一个CSS？！例如，我的搜索栏位于购物车顶部，如果我不小心将鼠标悬停在搜索栏上，那么我的购物车就会消失，因为它是顶层/第一层。这是一张图片。有没有办法在 CSS 中解决这个问题，其中购物车是第一层而不是第二层？提前致谢！

Answer 1

它基本上是一个z-index问题

您应该z-index为您的购物车 css 赋予更大的价值，而为您的搜索框div赋予更少的价值 z-index

CSS 中的 z-index 属性控制重叠元素的垂直堆叠顺序。例如，哪一个看起来好像离你更近。z-index 仅影响具有除静态（默认）以外的位置值的元素。

HTML

<div class="a"></div>
   <div class="b"></div>

CSS

.a {
    background:red;
    width:100px;
    height:50px;
    z-index:2;
        position:relative;    

}

.b {
    background:green;
    height: 50px;
    left: 20px;
    position: relative;
    top: -30px;
    width: 100px;
    z-index: 3;
}

演示