<分区>
标签 html css bootstrap-4
<分区>
我有一个 bootstrap 轮播，它在每个轮播元素中添加内联图像，并且此背景图像的不透明度需要为 .4。但是这个 carousel-item 的标题需要 1 不透明度。我有什么办法可以做到这一点吗？
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<!-- Slide One - Set the background image for this slide in the line below -->
<div class="carousel-item active" style="background-image: url('img/banner.jpg')">
<div class="carousel-caption d-none d-md-block">
<h2 class="display-4">First Slide</h2>
<p class="lead">This is a description for the first slide.</p>
</div>
</div>
</div>
</div>
最佳答案
Opacity 的默认初始值为 1。Opacity 不是继承的，而是因为父级具有适用于其中所有内容的不透明度。没有一些技巧，您不能使子元素的透明度低于父元素
子元素不会保留为子元素，只需更改它在您的 html 代码中的位置，然后只需在前一个子元素上添加 css 属性即可:
.child {
position : relative;
top : 5rem;
}
.parent {
opacity : 0;
}
希望对你有用
关于html - 如何在透明div中制作非透明元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57896340/