有没有办法使文本变亮而背景变暗？

如何解决有没有办法使文本变亮而背景变暗？

我想要一个带有明亮文本的深色背景，但是线性渐变和/或过滤器会使整个div变暗。有两种存档方法吗？ html（restraps）

import time

css

      <div class="banner">
        <Container>
          <div class="banner-text">
            <div class="banner-heading">Glad to see you here !</div>
            <div class="banner-sub-heading">
              Here goes the secondary heading on hero banner
            </div>
          </div>
        </Container>
      </div>

解决方法

是的，这是可能的；如果您从横幅背景的rgba中删除了Alpha通道；它将删除应用于所有子元素顶部的不透明度。

然后从标题文本和标题中删除过滤器css属性，这将同时删除这两个文本元素上的过滤效果，从而使颜色看起来像预期的那样。请看下面：

.banner {
  background: linear-gradient(rgb(0,0),rgb(0,0)),url("../images/page/Front.jpg");
  text-align: center;
  color: #fff;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.banner-text {
  padding: 200px 0 150px 0;
  color: white;
}
.banner-heading {
  font-family: "Lobster",cursive;
  font-size: 75px;
  font-weight: 700;
  line-height: 100px;
  margin-bottom: 30px;
  color: #ffff;
}

<div class="banner">
  <Container>
    <div class="banner-text">
      <div class="banner-heading">Glad to see you here !</div>
      <div class="banner-sub-heading">
        Here goes the secondary heading on hero banner
      </div>
    </div>
  </Container>
</div>

,

因此，我使用了减轻背景图片的效果

background-color:rgba(255,255,0.2);
background-blend-mode: lighten;

也许使用类似的方法但会使背景的css变暗，并尝试将其用于文本？