-
Notifications
You must be signed in to change notification settings - Fork 4
/
loading.html
18 lines (17 loc) · 1.81 KB
/
loading.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!-- saved from url=https://www.bytecho.net/ -->
<html>
<head>
<meta charset="utf-8">
<title>页面加载中,请稍候...</title>
<style>body{background:#f0f0f0;font-family:"Microsoft Yahei",Helvetica,arial,sans-serif;}.loading{-webkit-animation:fadein 2s;-moz-animation:fadein 2s;-o-animation:fadein 2s;animation:fadein 2s}@-moz-keyframes fadein{from{opacity:0}to{opacity:1}}@-webkit-keyframes fadein{from{opacity:0}to{opacity:1}}@-o-keyframes fadein{from{opacity:0}to{opacity:1}}@keyframes fadein{from{opacity:0}to{opacity:1}}.spinner-wrapper{position:absolute;top:0;left:0;z-index:300;height:100%;min-width:100%;min-height:100%;background:#f0f0f0}.spinner-text{position:absolute;top:50%;left:50%;margin-left:-90px;color:#BBB;letter-spacing:1px;font-weight:700;font-size:36px;}.spinner{position:absolute;top:50%;left:50%;display:block;margin-left:-160px;width:1px;height:1px;border:25px solid rgba(100,100,100,0.2);-webkit-border-radius:50px;-moz-border-radius:50px;border-radius:50px;border-left-color:transparent;border-right-color:transparent;-webkit-animation:spin 1.5s infinite;-moz-animation:spin 1.5s infinite;animation:spin 1.5s infinite}@-webkit-keyframes spin{0%,100%{-webkit-transform:rotate(0deg) scale(1)}50%{-webkit-transform:rotate(720deg) scale(0.6)}}@-moz-keyframes spin{0%,100%{-moz-transform:rotate(0deg) scale(1)}50%{-moz-transform:rotate(720deg) scale(0.6)}}@-o-keyframes spin{0%,100%{-o-transform:rotate(0deg) scale(1)}50%{-o-transform:rotate(720deg) scale(0.6)}}@keyframes spin{0%,100%{transform:rotate(0deg) scale(1)}50%{transform:rotate(720deg) scale(0.6)}}</style>
</head>
<body>
<div class="loading">
<div class="spinner-wrapper">
<span class="spinner-text">页面加载中,请稍候...</span>
<span class="spinner">
</span>
</div>
</div>
</body>
</html>