使子div在透明div的顶部不透明

Question

下面的html来自由WordPress插件呈现的滑块。我需要使“阅读更多”按钮不透明。你能帮忙吗？我也试着增加不透明度，但没有帮助。

<!-- ROW 0 -->
<div class="front-page-row bg-tan-light" id="row0">
<div class="wrap-x">
<div class="inside mini">
<article class="body-area mt2x">
<div class="wpsisac-slick-slider-wrp wpsisac-clearfix " data-conf="{&quot;dots&quot;:&quot;true&quot;,&quot;arrows&quot;:&quot;false&quot;,&quot;autoplay&quot;:&quot;true&quot;,&quot;autoplay_interval&quot;:&quot;50000&quot;,&quot;fade&quot;:&quot;false&quot;,&quot;lazyload&quot;:&quot;&quot;,&quot;speed&quot;:&quot;200&quot;,&quot;rtl&quot;:&quot;false&quot;,&quot;loop&quot;:&quot;true&quot;,&quot;hover_pause&quot;:&quot;true&quot;}">
<div id="wpsisac-slick-slider-1" class="wpsisac-slick-init wpsisac-slick-slider design-3 wpsisac-image-fit">
<div class="wpsisac-image-slide">
<div class="wpsisac-slide-wrap" style='height:400px;'>  
<img  src="http://pwp-wordpress/wp-content/uploads/2021/09/Holiday_Catalogue.jpg" alt="Holiday Catalog" />
<div class="wpsisac-slider-content">
<div class="wpsisac-bg-overlay wp-medium-6 wpcolumns">
<h2 class="wpsisac-slide-title">Holiday Catalog</h2>
<div class="wpsisac-slider-short-content"><p>View our 2021 Holiday Gift Brochure</p>
</div>
<div class="wpsisac-readmore"><a href="https://packedwithpurpose.gifts/how-to-order/gift-catalogue/" class="wpsisac-slider-readmore">Read More</a></div>
</div>
</div>
</div>
</div><div class="wpsisac-image-slide">
<div class="wpsisac-slide-wrap" style='height:400px;'>  
<img  src="http://pwp-wordpress/wp-content/uploads/2020/07/full-width-image1.jpg" alt="Test Slide 3" />
<div class="wpsisac-slider-content">
<div class="wpsisac-bg-overlay wp-medium-6 wpcolumns">
<h2 class="wpsisac-slide-title">Test Slide 3</h2>
<div class="wpsisac-slider-short-content"><p><strong>Rainforest preservation, clean water access, landfill waste reduction and sustainable agricultural practices.</strong></p>
</div>
<div class="wpsisac-readmore"><a href="https://www.wponlinesupport.com" class="wpsisac-slider-readmore">Read More</a></div>
</div>
</div>
</div>
</div>          </div>
</div>
</article>
</div>
</div>
</div><!-- ROW 0 -->

Answer 1

不要使用元素的不透明度。你试过用背景透明度代替吗？

background: rgba(255,255,255,0.3)