小编Ham*_*wan的帖子

我应该使用z-index属性还是其他方法？

我的问题是我想在图像类上放置绿色滤镜。我使用了z-index属性，但工作原理并不相同。过滤器不显示upp。我应该使用z-index属性还是其他方法？

这是我的主要代码：

header {
  height: 300px;
  width: 100%;
  position: relative;
  z-index: 0
  }
            
.black-filter { /*Not working for some reason*/
  height: 100%; 
  width: 100%; 
  position: absolute; 
  top: 0; 
  left: 0;
  z-index: 8;
  background-color: #66fb04a8
} 
         
.image {
  width: 100%;
  position: absolute
  ; top: 0;
  left: 0;
  z-index: 5;
  height: 100%;
  width: 100%;
  background-image: url('https://images.pexels.com/photos/209137/pexels-photo-209137.jpeg?auto=compress&cs=tinysrgb&dpr=3&h=750&w=1260');     
  background-size: cover; 
  filter: blur(2px)
 }
           
nav {
  width: 100%; 
  position: absolute;
  top: 0; 
  left: 0; 
  z-index: 10; 
  background: 
  hsla(0, 0%, 100%, 0);
  overflow: hidden;
 }

Run Code Online (Sandbox Code Playgroud)