我在将图像格式化为较暗以便阅读其上的文字时遇到麻烦。我正在使用bootstrap旋转木马主题，但是图像太暗！不透明度起作用，但它也使文本更透明。据我所知linear-gradient应该工作，但什么也没有发生。我已经在所有类上尝试过了（不仅仅是图像类幻灯片）。
.slide {
background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
}<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img class="slide" src="http://placehold.it/800x300" alt="First slide">
<div class="container">
<div class="carousel-caption">
<h1>Welcome to GroupWrites.</h1>
<p>Where creative writing meets social media. Discover our community of writers and readers and experience social writing. </p>
<p><a class="btn btn-lg btn-primary" href="/register" role="button">Sign up today</a></p>
</div>
</div>
</div>
</div>