<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="//at.alicdn.com/t/font_2862836_9q7vuodzudn.css">
<style>
.icon-loading1{
position: fixed;
left: 40vw;
top: calc(50% - 10vw);
display: inline-block;
20vw;
height: 20vw;
text-align: center;
line-height: 20vw;
color: #666;
transform-origin: 50% 50%; // 中心旋转
font-size: 16vw;
animation: load 2s linear infinite; // 2s无限循环
}
@keyframes load{
0%{
transform: rotate(0);
}
30%{
transform: rotate(80deg);
}
70%{
transform: rotate(280deg);
}
100%{
transform: rotate(360deg);
}
}
</style>
</head>
<body>
<span class="iconfont icon-loading1"></span>
</body>
</html>
