Css Can'；t重置-webkit过滤器：在内部分区中

我对-webkit筛选器属性有问题。我有一个显示背景图像的div，在它里面有另一个div，它是图标、徽标和标题文本的容器

背景图像类：

.image-bg-fluid-height,


.image-bg-fixed-height {

     -webkit-filter:brightness(50%);
    -moz-filter:brightness(50%);
    filter: url(#brightness); /* required for FF */
    filter:brightness(50%);
}

.image-bg-fixed-height {
    text-align: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;

}

.image-bg-fluid-height {
    background: url('../images/header.png') no-repeat center center scroll;
    padding: 100px 0;
}

.image-bg-fixed-height {
    background: url('../images/header.png') no-repeat center center scroll;
    height: 80%;
}

内部div类：

.overlay-layer{
    -webkit-filter: initial;
    filter: initial;  

}

和HTML：

     <header class="image-bg-fluid-height ">
        <div class="containter">
            <div class="row">
            <div class="col-sm-10 col-sm-offset-1">
                <div class="overlay-layer">
                <img class="img-responsive img-center" src="images/logo-2.png" alt="">
[...]

[...]

---

不幸的是，“覆盖层”内的任何内容也会受到webkit过滤器（50%亮度等）的影响，我无法重置它。我也试着将其设置为100%，但也不起作用

你不能。过滤选项（以及其他样式属性，例如不透明度）会影响元素及其内部的所有内容

---

唯一（较差）的选择是制作一个div，覆盖

.image bg fixed height

元素。

这不是原始问题的解决方案（重置webkit过滤器），但我用以下代码解决了原始问题（背景图像变暗，但不影响内部内容）：

background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url('../images/header.png') no-repeat center center scroll;

---

Ted也已经回答了这个问题，不幸的是这是不可能的

不幸的是，这就是它的工作方式。在另一个包含筛选器的元素中重置该元素的筛选器不会重置父元素的筛选器。@rvervourt就在您的名字旁边--根据您的评论，几乎没有编辑和删除按钮。还有其他方法可以创建暗显的背景图像以不影响内部div吗？您能详细介绍一下吗？当然，我可以在photoshop中使用dimm文件，但我更愿意动态执行。是的，请参见此处的演示：。你需要放置一个绝对覆盖图，让它填满另一个分区。我希望你能理解