模糊背景圖像不是文字懸停

Question

你好親愛的開發者，

Iam有一個問題，編碼我的郵政網格。我想在懸停時模糊背景圖像。但是我的文本（在同一個div中也很模糊）。你有這個解決方案嗎？或者沒有其他的方式，沒有在容器中使用這個圖片。要保持它作爲背景圖片

的帖子PHP：

<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
      <div class="article" style="background-image: url(<?php echo the_post_thumbnail_url(); ?>);" onclick="self.location.href='<?php echo get_permalink($leavename = false); ?>'"> 
       <div class="post_info"> 
        <span class="post_cat"><?php the_category(' ') ?></span> 
        <h2 class="post_title"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2> 
        <span class="post_date"><?php the_time('d.m.Y') ?></span> 
       </div> 

      <!-- .article --></div> 

的CSS：

.article:hover { 
-webkit-filter: blur(2px); 
} 
.article { 
margin-top: 15px; 
position: relative; 
height: 229px; 
margin-left: 15px; 
margin-right: 15px; 
float: left; 
width: 25%; 
cursor: pointer; 
} 

謝謝你幫助我，ExotiQ

Answer 1

您不能模糊背景圖像，但您可以模糊任何元素或僞元素

我會繼續解決你的問題，但是這個總結起來很不錯。 Check out this awnser

希望能幫助你！