前言
你们看到这张图片是不是觉得网站出问题了？
哈哈哈！当然不是！这可是CSS做出来的效果
大家维护站点时，可能想把站点搞成网站无法访问
下面就是源码了
<!DOCTYPE html>
<html dir="ltr" lang="zh" i18n-processed=""><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="theme-color" content="#fff">
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
<title>无法访问此网站</title>
<script>
document.oncontextmenu=new Function("return false")
document.onselectstart=new Function("return false")
</script>
<style>
html {
-webkit-text-size-adjust: 100%;
font-size: 125%;
}
button {
border: 0;
border-radius: 2px;
box-sizing: border-box;
color: #fff;
cursor: pointer;
float: right;
font-size: .875em;
margin: 0;
padding: 10px 24px;
transition: box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
user-select: none;
}
.neterror button{
background: rgb(66, 133, 244);
}
button:active {
background: rgb(50, 102, 213);
outline: 0;
}
button:hover {
box-shadow: 0 1px 3px rgba(0, 0, 0, .50);
}
h1 {
color: #333;
font-size: 1.6em;
font-weight: normal;
line-height: 1.25em;
margin-bottom: 16px;
}
.icon {
height: 72px;
margin: 0 0 40px;
width: 72px;
}
.interstitial-wrapper {
box-sizing: border-box;
font-size: 1em;
line-height: 1.6em;
margin: 14vh auto 0;
max-width: 600px;
width: 100%;
}
.nav-wrapper {
margin-top: 51px;
}
@media (max-width: 420px) {
button,
[dir='rtl'] button,
.small-link {
float: none;
font-size: .825em;
font-weight: 400;
margin: 0;
text-transform: uppercase;
width: 100%;
}
}
a {
color: rgb(17, 85, 204);
text-decoration: none;
}
.icon-generic {
content: -webkit-image-set(
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAACQAQMAAADdiHD7AAAABlBMVEUAAABTU1OoaSf/AAAAAXRSTlMAQObYZgAAAFJJREFUeF7t0cENgDAMQ9FwYgxG6WjpaIzCCAxQxVggFuDiCvlLOeRdHR9yzjncHVoq3npu+wQUrUuJHylSTmBaespJyJQoObUeyxDQb3bEm5Au81c0pSCD8HYAAAAASUVORK5CYII=) 2x);
}
.error-code {
display: block;
font-size: .8em;
}
.single-suggestion {
list-style-type: none;
padding-left: 0;
}
.suggested-left > #control-buttons,
.suggested-right > #details-button {
float: left;
}
</style>
</head>
<body id="t" style="font-family: 'Segoe UI',Arial,'Microsoft Yahei',sans-serif; font-size: 75%" class="neterror">
<div id="main-frame-error" class="interstitial-wrapper">
<div id="main-content">
<div class="icon icon-generic"></div>
<div id="main-message">
<h1 jsselect="heading">无法访问此网站</h1>
<p jsselect="summary">找不到服务器 IP 地址。</p>
<div id="suggestions-list">
<ul class="single-suggestion">
<li><a href="#" id="diagnose-link">尝试运行 Windows 网络诊断</a>。</li>
</ul>
</div>
<div class="error-code">DNS_PROBE_FINISHED_NXDOMAIN</div>
</div>
</div>
<div id="buttons" class="nav-wrapper suggested-left">
<div id="control-buttons">
<button id="reload-button" class="blue-button text-button">重新加载</button>
</div>
</div>
</div>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?0d4ccbd69b8cfbf8dd706310feccee2f";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</body></html>本文共 99 个字数,平均阅读时长 ≈ 1分钟
评论 (0)