##404页面，
<!DOCTYPE html>
< html >
< head >
< meta charset = "UTF-8" >
< title > 403< / title >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" >
< meta http-equiv = "Access-Control-Allow-Origin" content = "*" >
< meta name = "viewport" content = "width=device-width, initial-scale=1, maximum-scale=1" >
< meta name = "apple-mobile-web-app-status-bar-style" content = "black" >
< meta name = "apple-mobile-web-app-capable" content = "yes" >
< meta name = "format-detection" content = "telephone=no" >
< link rel = "stylesheet" href = "static/lib/layui-v2.6.3/css/layui.css" media = "all" >
< style >
.error .clip .shadow {height:180px;}
.error .clip:nth-of-type(2) .shadow {width:130px;}
.error .clip:nth-of-type(1) .shadow,.error .clip:nth-of-type(3) .shadow {width:250px;}
.error .digit {width:150px;height:150px;line-height:150px;font-size:120px;font-weight:bold;}
.error h2 {font-size:32px;}
.error .msg {top:-190px;left:30%;width:80px;height:80px;line-height:80px;font-size:32px;}
.error span.triangle {top:70%;right:0%;border-left:20px solid #535353;border-top:15px solid transparent;border-bottom:15px solid transparent;}
.error .container-error-404 {top: 50%;margin-top: 250px;position:relative;height:250px;padding-top:40px;}
.error .container-error-404 .clip {display:inline-block;transform:skew(-45deg);}
.error .clip .shadow {overflow:hidden;}
.error .clip:nth-of-type(2) .shadow {overflow:hidden;position:relative;box-shadow:inset 20px 0px 20px -15px rgba(150,150,150,0.8),20px 0px 20px -15px rgba(150,150,150,0.8);}
.error .clip:nth-of-type(3) .shadow:after,.error .clip:nth-of-type(1) .shadow:after {content:"";position:absolute;right:-8px;bottom:0px;z-index:9999;height:100%;width:10px;background:linear-gradient(90deg,transparent,rgba(173,173,173,0.8),transparent);border-radius:50%;}
.error .clip:nth-of-type(3) .shadow:after {left:-8px;}
.error .digit {position:relative;top:8%;color:white;background:#1E9FFF;border-radius:50%;display:inline-block;transform:skew(45deg);}
.error .clip:nth-of-type(2) .digit {left:-10%;}
.error .clip:nth-of-type(1) .digit {right:-20%;}
.error .clip:nth-of-type(3) .digit {left:-20%;}
.error h2 {font-size:24px;color:#A2A2A2;font-weight:bold;padding-bottom:20px;}
.error .tohome {font-size:16px;color:#07B3F9;}
.error .msg {position:relative;z-index:9999;display:block;background:#535353;color:#A2A2A2;border-radius:50%;font-style:italic;}
.error .triangle {position:absolute;z-index:999;transform:rotate(45deg);content:"";width:0;height:0;}
@media(max-width:767px) {.error .clip .shadow {height:100px;}
.error .clip:nth-of-type(2) .shadow {width:80px;}
.error .clip:nth-of-type(1) .shadow,.error .clip:nth-of-type(3) .shadow {width:100px;}
.error .digit {width:80px;height:80px;line-height:80px;font-size:52px;}
.error h2 {font-size:18px;}
.error .msg {top:-110px;left:15%;width:40px;height:40px;line-height:40px;font-size:18px;}
.error span.triangle {top:70%;right:-3%;border-left:10px solid #535353;border-top:8px solid transparent;border-bottom:8px solid transparent;}
.error .container-error-404 {height:150px;}
}
< / style >
< / head >
< body >
< div class = "error" >
< div class = "container-floud" >
< div style = "text-align: center" >
< div class = "container-error-404" >
< div class = "clip" >
< div class = "shadow" >
< span class = "digit thirdDigit" > < / span >
< / div >
< / div >
< div class = "clip" >
< div class = "shadow" >
< span class = "digit secondDigit" > < / span >
< / div >
< / div >
< div class = "clip" >
< div class = "shadow" >
< span class = "digit firstDigit" > < / span >
< / div >
< / div >
< div class = "msg" > OH!
< span class = "triangle" > < / span >
< / div >
< / div >
< h2 class = "h1" > 很抱歉,您的权限非超级管理员无法访问< / h2 >
< / div >
< / div >
< / div >
< script src = "static/lib/layui-v2.6.3/layui.js" charset = "utf-8" > < / script >
< script >
function randomNum() {
return Math.floor(Math.random() * 9) + 1;
}
var loop1, loop2, loop3, time = 30, i = 0, number;
loop3 = setInterval(function () {
if (i > 40) {
clearInterval(loop3);
document.querySelector('.thirdDigit').textContent = 4;
} else {
document.querySelector('.thirdDigit').textContent = randomNum();
i++;
}
}, time);
loop2 = setInterval(function () {
if (i > 80) {
clearInterval(loop2);
document.querySelector('.secondDigit').textContent = 0;
} else {
document.querySelector('.secondDigit').textContent = randomNum();
i++;
}
}, time);
loop1 = setInterval(function () {
if (i > 100) {
clearInterval(loop1);
document.querySelector('.firstDigit').textContent = 3;
} else {
document.querySelector('.firstDigit').textContent = randomNum();
i++;
}
}, time);
< / script >
< / body >
< / html >
