📜  如何使用 HTML 和 CSS 创建渐变背景动画?

📅  最后修改于: 2021-10-29 06:13:41             🧑  作者: Mango

通过使用生成所需动画的简单 HTML 和 CSS @keyframes规则,可以将渐变动画添加到您网站的背景中。

HTML 代码:在下面的示例中,实现了 HTML 页面的基本结构。



  

    
    
    Gradient Background Animation

  

    
        
            

GeeksforGeeks

            

Gradient background Animation

        
    
  

CSS 代码:在下一节中,背景的设计是使用提供动画功能的简单 CSS @keyframes规则实现的。使用linear-gradient()函数提供不同的渐变颜色。


完整代码:是以上两个代码段的组合。



  

    
    
    Gradient Background Animation

  

  

    
        
            

GeeksforGeeks

            

Gradient background Animation

        
    
  

输出: