Html 加载动画不需要'；我不在IE工作

我想在页面完全加载时显示加载div。CSS旋转功能在Google Chrome上运行得很好，但在IE上不起作用

下面是我的CSS代码和html代码

/*透明*/
.tr_加载{
宽度：100%；
身高：100%；
位置：固定；
排名：0；
右：0；
底部：0；
左：0；
背景色：rgba（0,0,0,5）；
}
.tr_装载轮{
宽度：20px；
高度：20px；
利润上限：-40px；
左边距：-40px；
位置：绝对位置；
最高：50%；
左：50%；
边框宽度：30px；
边界半径：50%；
-webkit动画：旋转1s线性无限；
-o-动画：自旋1s线性无限；
动画：旋转1s线性无限；
}
.样式-2.tr_加载轮{
边框样式：双边框；
边框颜色：#ccc透明；
}
@-webkit关键帧旋转{
0% {
-webkit变换：旋转（0度）；
}
100% {
-webkit变换：旋转（-360度）；
}
}

---

以下是供应商前缀代码的示例，并非所有浏览器都支持

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
  }
}

使用标准变量，即：

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

有关上的

@关键帧

，请参阅详细文档

工作演示：

/*透明*/
.tr_加载{
宽度：100%；
身高：100%；
位置：固定；
排名：0；
右：0；
底部：0；
左：0；
背景色：rgba（0,0,0,5）；
}
.tr_装载轮{
宽度：20px；
高度：20px；
利润上限：-40px；
左边距：-40px；
位置：绝对位置；
最高：50%；
左：50%；
边框宽度：30px；
边界半径：50%；
-webkit动画：旋转1s线性无限；
-o-动画：自旋1s线性无限；
动画：旋转1s线性无限；
}
.样式-2.tr_加载轮{
边框样式：双边框；
边框颜色：#ccc透明；
}
@关键帧旋转{
0% {
变换：旋转（0度）；
}
100% {
变换：旋转（-360度）；
}
}