如何使用 CSS 和 HTML 在按钮上创建波浪？

按钮上的波浪效果是一种效果，其中按钮的形状在悬停时变成波浪。虽然还有其他方法可以创建波浪效果，但一个简单的方法是使用关键帧属性。

方法：为了动画按钮，我们使用关键帧来逐步设置不同阶段的过渡。
HTML代码：
HTML 代码是一个简单的结构，其中包含一个包装器，其中 span 标签被包装在锚标签内。

  
  
    

      wave
    
  

CSS 代码：

对于 CSS，这些是以下步骤：
• 添加背景颜色等基本样式，定位按钮并设置按钮的宽度和高度。
• 使用名为 wave 的标识符的动画属性。
• 现在使用关键帧通过使用 transform 属性根据它们的角度为每个帧设置动画。

完整代码：

  
    
  
  
    

      wave
    
  

输出：