如何使用 HTML 和 CSS 创建 Neumorphism Effect？

Neumorphism (neomorphism) 是一种为任何网页的网页元素设计样式并提供 3D 效果的现代方式。这种动画效果可以通过使用 HTML 和 CSS 轻松生成。 CSS 的 Box-shadow 属性可用于实现 Neumorphism。它用于在给定元素的一侧添加暗影，在给定元素的另一侧添加光影。

HTML 代码：在本节中，我们将制作盒子的布局。

• 索引.html：

HTML

  

    

  

    

        
 GeeksForGeeks
        
GeeksForGeeks
    

  

CSS 代码：在本节中，我们将使用一些 CSS 属性来设计框。

• 索引.css：

HTML

完整代码：在本节中，我们将结合以上两节使用 HTML 和 CSS 创建一个 Neumorphism。

HTML

  

  
  
   

  

    

        
 GeeksForGeeks
        
GeeksForGeeks
    

    

输出：