如何在 Google AMP 中为 amp-anim 设置图像占位符？

如果您想在您的 AMP 网页上嵌入动画，则可以使用此标签来实现。它可以帮助开发人员在您的 Web 平台中嵌入动画、gif、webp 等。这确实是一个非常有用的标签，因为在您的网站上添加动画确实使它变得俗气和好看。

设置：要在您的 AMP 网页中使用 amp-anim，您必须导入此脚本。

它在大多数方面类似于 amp-img。

要添加占位符，我们将使用 amp-img 添加一个占位符，如果动画未加载，该占位符将显示。

例子：

HTML

  

    
    Google AMP amp-anim
  
    
    
      
    
    
    
  
    
  
    
  
    
        body {
            -webkit-animation: -amp-start 8s 
                steps(1, end) 0s 1 normal both;
              
            -moz-animation: -amp-start 8s 
                steps(1, end) 0s 1 normal both;
              
            -ms-animation: -amp-start 8s 
                steps(1, end) 0s 1 normal both;
              
            animation: -amp-start 8s 
                steps(1, end) 0s 1 normal both
        }
  
        @-webkit-keyframes -amp-start {
            from {
                visibility: hidden
            }
  
            to {
                visibility: visible
            }
        }
  
        @-moz-keyframes -amp-start {
            from {
                visibility: hidden
            }
  
            to {
                visibility: visible
            }
        }
  
        @-ms-keyframes -amp-start {
            from {
                visibility: hidden
            }
  
            to {
                visibility: visible
            }
        }
  
        @-o-keyframes -amp-start {
            from {
                visibility: hidden
            }
  
            to {
                visibility: visible
            }
        }
  
        @keyframes -amp-start {
            from {
                visibility: hidden
            }
  
            to {
                visibility: visible
            }
        }
    
    
        
            body {
                -webkit-animation: none;
                -moz-animation: none;
                -ms-animation: none;
                animation: none
            }
        
    
    
        h1 {
            color: forestgreen;
        }
    

  

    
        
            Geeks For Geeks
        
    
      
    
          
        
        
    

  

输出：