animation動畫效果(相容各個瀏覽器)的模板

1.目前來說最新版的幾個大廠瀏覽器都已經支援animation，但是不乏很多人依然在用老版的瀏覽器，所以還是需要進行動畫適配的。

2.具體支援版本如下：

3.舉例如下：

.classname{
	animation:test 2s linear infinite;
	-webkit-animation:test 2s linear alternate ;/*Webkit核心的瀏覽器（如 Safari、Chrome）*/
	-moz-animation:test 2s linear alternate ;/*gecko核心的瀏覽器（如 Firefox）*/
	-o-animation:test 2s linear alternate ;/*Opera 瀏覽器*/
	-ms-animation:test 2s linear alternate ;/*IE8+*/
}
@keyframes test{
        0%   {}
        100% {}
    }
@-webkit-keyframes test{
        0%   {}
        100% {}
    }
@-moz-keyframes test{
        0%   {}
        100% {}
    }
@-o-keyframes test{
        0%   {}
        100% {}
    }
@-ms-keyframes test{
        0%   {}
        100% {}
    }
 

分享從不妥協，程式碼改變世界。
  來自戈小戈，轉載請註明原文連結：https://www.cnblogs.com/wsgxg/p/15408623.html