入门 CSS 悬停动画

Primer CSS是一个免费的开源 CSS 框架，它建立在创建基本样式元素（如间距、排版和颜色）基础的系统之上。它具有高度可重用性和灵活性。它是使用 GitHub 的设计系统创建的。

动画是吸引用户访问网页特定部分的重要工具。它有助于指出对消费者很重要的事情。我们可以将不同类型的动画用作悬停类型。悬停动画用于在用户悬停在 UI 元素上时提升或放大它。

入门 CSS 悬停动画类：

• .anim-hover-grow：将此类添加到相应的元素以实现此动画。

句法：

     ...

示例：此示例演示了如何使用anim-hover-grow类来使用 Primer CSS Hover 动画。您可以在下图中看到输出。当用户将鼠标悬停在图像上时，它会放大。

HTML

  

    
    

  

    

        

            GeeksforGeeks
        
          
        
Primer CSS Hover Animation


    
  
    

        
    

  

输出：

入门 CSS 悬停动画

参考： https://primer.style/css/utilities/animations#hover-animation