📜  如何在 CSS 中设置模糊距离?

📅  最后修改于: 2021-08-30 12:46:25             🧑  作者: Mango

模糊距离意味着模糊元素的边界并使用 CSS 设置其距离。在本文中,我们将看到如何使用 CSS 设置模糊距离,以设置 HTML 元素上的模糊距离样式。

您可以使用box-shadow属性为元素的框架提供类似阴影的效果。

句法:

box-shadow: h-offset v-offset blur color;

适当的价值:

  • h-offset:水平阴影值。
  • v-offset:垂直阴影值。
  • 模糊:模糊阴影。

示例 1:在此示例中,我们将在 div 元素上添加模糊距离效果。

HTML


  

    

  

    

GeeksforGeeks

    
Box-shadow blur
  


HTML


  

    

  

    
        

Welcome to GeeksforGeeks!

    


       
        A computer Science portal     
  


输出:

示例 2:在此示例中,我们将向两个不同的 div 元素添加蓝色距离属性。

HTML



  

    

  

    
        

Welcome to GeeksforGeeks!

    


       
        A computer Science portal     
  

输出: