Question

我已经尝试了几个小时，这让我很紧张。我正在使用bootstrap和spin.js库。我正在尝试在img标记上添加颜色图层，但这根本不起作用。

我正在处理的代码是this

CSS代码

        .container-fluid {
            position: relative;
            padding: 0;
            margin: 0;
        }
        .header{
            position: relative;
            max-height: 920px;
            height: 100%;
        }
        .header_layer{
            position: relative;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100px;
            background-color: darkgrey;
            z-index: 100;
        }
        .img_header{
            position: relative;
            top: 0px;
            left: 0px;
            width: 100%;
            z-index: 99;
        }

HTML代码：

<div class="container-fluid">
    <div class="header col-md-12">
        <div class="header_layer"></div>
        <img src="http://placehold.it/350x150" class="img-responsive img_header">          
    </div>
</div>

但是，非常感谢。

Answer 1

在您提供position:relative和top/left : 0时，元素不会重叠，我猜您需要position:absolute

HTML - 为什么z-index不起作用？

1 个答案: