index.html

<!--如果这和黑客攻击有关，那我们祝福黑客去死 微笑 -->
<html><head>
	<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>云课堂网 - 维护页面</title>
<style>
    ::selection{
	background:#ff6500;
	color:#fff;
}
::-moz-selection{
	background:#ff6500;
	color:#fff;
}

*{
	margin: 0;
	padding: 0;
}
body,html{
	width: 100%;
	height: 100%;
}
body{
	background: #fafafa;
	font-family: -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Source Han Sans SC,Noto Sans CJK SC,Microsoft YaHei,WenQuanYi Micro Hei,sans-serif;
}
.notice-wrap{
	padding-top: 30px;
}
.notice{
	margin: 0 auto;
	max-width: 640px;
	height: 34em;
	background: url(https://i.loli.net/2020/04/12/dGgilm51LzpetOZ.png)  no-repeat top center;
	border-radius: 1.5em;
	background-size: cover;
}
.notice h1{
	font-size: 36px;
	color: #333;
	text-align: center;
	margin-bottom: 1.1em;
	padding-top: 215px;
}
	
::-webkit-scrollbar{
width:0;
}

.notice-inner>p{
	margin: 0 2em;
	font-size: 18px;
	color: #666;
	text-indent: 36px;
	line-height: 40px;
}
p span{
	color: #ff6500;
}
.notice .notice-cont{margin-top: 0.5em;}
.notice .notice-tel{
	padding-bottom: 1em;
}
.notice-foot{
	margin-top: 1em;
	padding: 1em;
	border-top: 2px solid #f2f2f2;
}
.notice-foot p{
	font-size: 18px;
	color: #666;
	text-align: center;}

.notice:after {content: "";background: #ff6500;width: 100%;height: 90%;display: block;position: relative;top: -30em;border-radius: 1.5em;box-shadow: 0 1em 2em -1em #ff6c0b;z-index: -1;}

.notice-inner {
	max-height: 33em;
	overflow: auto;
}
    </style>
    </head>

<body>
	<div class="notice-wrap">
		<div class="notice">
    <div class="notice-inner">
		        <h1>临时维护通知</h1>
			<p class="notice-cont">您好！<span>咕学网</span>由于更新服务器和域名，当前正在维护。</p>
			<p class="notice-tel">我们正在进行维护，预计恢复时间在：<span>2020/07/21 00：00</span>！</p>
			<p class="notice-cont">2020/07/20 11:11更新:恢复时间延迟到22日00:00</p>
                        <p class="notice-cont">原因数据量庞大，迁移需要时间</p>
			
			<div class="notice-foot">
				<p>正在维护，工程师工作中</p>
			</div>
	    
	               <!-- <h1>一切正常</h1>
			<p class="notice-cont">您好！<span>云课堂网</span>运行正常。</p>
			
			<p class="notice-cont">工程师和程序员们还在为各位服务哦！当前什么都是好好的呢~</p>
			
			<div class="notice-foot">
				<p>一切正常，感谢关心</p>
			</div>-->
	    
	    
			</div>
    
		</div>
	</div>


</body></html>