recently at the front end, I designed a website by myself. I want to make it happen.
the result is stuck on the background blur does not affect the child elements, how to make the background blur, the cover image above is displayed normally? According to some articles, the use of pseudo-classes will not work.
HTML is as follows
<section id="banner" class="clearfix">
<div id="banner_content_wrapper">
<div id="cover" >
<img src="../images/book1.jpg" alt="">
<div class="best_of_month">8
</div>
</div>
<div id="content">
<h2></h2>
<div id="rating">
<span class="oi oi-star" title="e" aria-hidden="true"></span>
<span class="oi oi-star"></span>
<span class="oi oi-star"></span>
<span class="oi oi-star"></span>
<span class="oi oi-star"></span>
<span class="oi oi-star inactive"></span>
</div>
<p class="author">:[]
<p class="tag"><span>/</span><span>/</span>
<p class="desicription">"" ""
</div>
</div>
</section> 