本文最后更新于2025年1月9日16:06 星期四,请注意资讯或者链接时效,如有失效请在文章评论区留言反馈。
小编本身喜欢收集一些有趣或者功能比较好用的代码,偶然间捡到一个仿Windows蓝屏404界面代码,具体来源不清楚了。如果您知道,可以留言,小编标明来源。
预览
代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>404 - 页面未找到</title>
<style>
body {
background-color: #0267d9;
color: #FFFFFF;
font-family: Microsoft Yahei, "Helvetica Neue", Helvetica, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif;
margin-left: 100px;
}
.face {
font-size: 100px;
}
p {
font-size: 24px;
padding: 8px;
line-height: 40px;
}
.tips {
font-size: 16px
}
/*针对小屏幕的优化*/
@media screen and (max-width: 600px) {
body {
margin: 0 10px;
}
p {
font-size: 18px;
line-height: 30px;
}
.tips {
display: inline-block;
padding-top: 10px;
font-size: 14px;
line-height: 20px;
}
}
</style>
</head>
<body>
<script>
var i = 5;
var intervalid;
intervalid = setInterval("cutdown()", 1000);
function cutdown() {
if (i == 0) {
window.location.href = "https://www.ilxtx.com/dragon.html?aff=ypdpq7pdy";
clearInterval(intervalid);
}
document.getElementById("mes").innerHTML = i;
i--;
}
window.onload = cutdown;
</script>
<span class="face">:(</span>
<p>您访问的页面没有找到。<br>
<span id="mes"></span> 秒后转至网站首页;<br>
<p class="paddingbox">或者在倒计时结束前点击以下链接继续浏览网页</p>
<p>》<a style="cursor:pointer" onclick="history.back()">返回上一页面</a></p>
<span class="tips">如果您想了解更多信息,则可以稍后在线搜索此错误: 算了你还是别搜了……</span>
</p>
</body>
</html>
首页跳转链接可在第59行自行设置,模板里面跳转的是Dragon龙主题
声明:本文为原创文章,版权归叭叭部落格所有,欢迎分享本文,转载请保留出处!