自用好看高级的404页面源码

发表于 6 小时前

马上注册，结交更多好友，享用更多功能，让你轻松玩转小K网。

您需要登录才可以下载或查看，没有账号？立即注册

×

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>404 Not Found</title>
<style>
*{margin:0;padding:0;box-sizing:border-box;font-family:Consolas,"Microsoft YaHei",monospace;}
body{background:#1e1e1e;color:#d4d4d3;display:flex;height:100vh;overflow:hidden;}

.editor-container{flex:1;display:flex;flex-direction:column;}
.tab-bar{height:35px;background:#2d2d2d;padding:0 10px;display:flex;align-items:center;border-bottom:1px solid #1a1a1a;}
.tab{padding:0 12px;height:100%;display:flex;align-items:center;font-size:13px;color:#858585;}
.tab.active{background:#1e1e1e;color:#fff;}

.editor{flex:1;padding:10px;display:flex;overflow:hidden;}
.line-numbers{color:#858585;padding-right:12px;text-align:right;user-select:none;min-width:40px;line-height:1.6;}
.code-content{line-height:1.6;font-size:14px;white-space:pre;overflow:hidden;}

.cm-comment{color:#6A9955;}
.cm-keyword{color:#569CD6;}
.cm-type{color:#4EC9B0;}
.cm-string{color:#CE9178;}
.cm-number{color:#B5CEA8;}
.cm-operator{color:#D4D4D4;}

.sidebar{width:340px;background:#252526;border-left:1px solid #1a1a1a;display:flex;flex-direction:column;}
.sidebar-header{height:35px;padding:0 10px;display:flex;align-items:center;color:#ccc;border-bottom:1px solid #1a1a1a;font-size:13px;}
.sidebar-content{flex:1;padding:10px;overflow:hidden;font-size:13px;}
.solution-item{padding:3px 0;}
.indent1{padding-left:16px;}
.indent2{padding-left:32px;}
.indent3{padding-left:48px;}
.active{background:#094771;color:#fff;}

#hackModal{
position:fixed;inset:0;background:#000;color:#0f0;font-size:46px;font-weight:bold;
display:flex;align-items:center;justify-content:center;flex-direction:column;
z-index:9999;display:none;text-align:center;line-height:1.8;
}
.flash{animation:flash 0.15s infinite alternate;}
@keyframes flash{
0%{background:#000;color:#0f0;}
100%{background:#ff0000;color:#fff;}
}
</style>
</head>
<body>

<div class="editor-container">
  <div class="tab-bar">
    <div class="tab active">RequestManager.cs</div>
  </div>
  <div class="editor">
    <div class="line-numbers">1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10<br>11<br>12<br>13<br>14<br>15<br>16<br>17<br>18<br>19<br>20<br>21<br>22<br>23<br>24<br>25<br>26<br>27<br>28<br>29<br>30<br>31<br>32<br>33<br>34<br>35<br>36<br>37<br>38<br>39<br>40<br>41<br>42<br>43<br>44<br>45</div>
    <div class="code-content" id="code"></div>
  </div>
</div>

<div class="sidebar">
  <div class="sidebar-header">解决方案资源管理器</div>
  <div class="sidebar-content">
    <div class="solution-item indent1">▶ 解决方案 WebErrorSystem (1 个项目)</div>
    <div class="solution-item indent1">▼ WebErrorSystem</div>
    <div class="solution-item indent2">▼ Properties</div>
    <div class="solution-item indent3">AssemblyInfo.cs</div>
    <div class="solution-item indent3">Resources.resx</div>
    <div class="solution-item indent3">Settings.settings</div>
    <div class="solution-item indent2">▼ References</div>
    <div class="solution-item indent3">System.Net</div>
    <div class="solution-item indent3">System.Core</div>
    <div class="solution-item indent3">System.Web</div>
    <div class="solution-item indent2">▼ Network</div>
    <div class="solution-item indent3 active">RequestManager.cs</div>
    <div class="solution-item indent3">HttpHelper.cs</div>
    <div class="solution-item indent3">ResponseParser.cs</div>
    <div class="solution-item indent3">NetConfig.cs</div>
    <div class="solution-item indent2">▼ Models</div>
    <div class="solution-item indent3">ApiResult.cs</div>
    <div class="solution-item indent3">ErrorInfo.cs</div>
    <div class="solution-item indent2">▼ Utils</div>
    <div class="solution-item indent3">LogHelper.cs</div>
    <div class="solution-item indent3">JsonUtil.cs</div>
    <div class="solution-item indent2">App.config</div>
    <div class="solution-item indent2">Program.cs</div>
    <div class="solution-item indent2">WebErrorSystem.csproj</div>
  </div>

  <div class="sidebar-header">属性</div>
  <div class="sidebar-content">
    <div class="solution-item"><b>文件属性</b></div>
    <div class="solution-item">文件名: RequestManager.cs</div>
    <div class="solution-item">完整路径: D:\Projects\WebErrorSystem\Network\</div>
    <div class="solution-item">文件大小: 5.87 KB</div>
    <div class="solution-item">创建时间: 2026-03-10 10:25:33</div>
    <div class="solution-item">修改时间: 2026-03-10 11:12:49</div>
    <div class="solution-item">访问时间: 2026-03-10 11:12:49</div>
    <div class="solution-item">只读: 否</div>
    <div class="solution-item">隐藏: 否</div>
    <div style="height:10px;"></div>
    <div class="solution-item"><b>高级属性</b></div>
    <div class="solution-item">生成操作: 编译</div>
    <div class="solution-item">复制到输出目录: 不复制</div>
    <div class="solution-item">自定义工具: 无</div>
    <div class="solution-item">文件格式: UTF-8</div>
    <div style="height:10px;"></div>
    <div class="solution-item"><b>代码属性</b></div>
    <div class="solution-item">命名空间: WebErrorSystem.Network</div>
    <div class="solution-item">类名: RequestManager</div>
    <div class="solution-item">行数: 89</div>
    <div class="solution-item">错误计数: 3</div>
    <div class="solution-item">警告计数: 0</div>
  </div>
</div>

<div id="hackModal">
⚠️ 网页无法打开 ⚠️
<br>
目标服务器拒绝连接
<br>
请求超时 · 主机不可达
<br><br>
404 Not Found
</div>

<script>
const code = `// 尝试打开目标网页
try {
    string url = "http://liuxingxiaowu.top/";
    HttpWebRequest request = (HttpWebRequest)WebRequest.Create(url);
    request.Timeout = 3000;
    request.Method = "GET";
    
    // 尝试获取响应
    using (HttpWebResponse response = (HttpWebResponse)request.GetResponse()) {
        if (response.StatusCode != HttpStatusCode.OK) {
            throw new WebException("网页打开失败");
        }
    }
}
catch (WebException) {
    // 服务器无响应 / 网页无法访问
    Environment.FailFast("致命错误：网络连接失败，目标主机不可达");
}`;

const codeEl = document.getElementById("code");
let i = 0;

function type() {
  if (i < code.length) {
    let txt = code.slice(0, i + 1);
    codeEl.innerHTML = highlight(txt);
    i++;
    setTimeout(type, 40);
  } else {
    let modal = document.getElementById("hackModal");
    modal.style.display = "flex";
    modal.classList.add("flash");
  }
}

function highlight(text) {
  return text
    .replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;")
    .replace(/ /g, "&nbsp;")
    .replace(/\/\/.*/g, m => `<span class=cm-comment>${m}</span>`)
    .replace(/".*?"/g, m => `<span class=cm-string>${m}</span>`)
    .replace(/\b(try|catch|string|if|throw|using)\b/g, m => `<span class=cm-keyword>${m}</span>`)
    .replace(/\b(HttpWebRequest|WebRequest|Create|HttpWebResponse|GetResponse|HttpStatusCode|WebException|Environment|FailFast)\b/g, m => `<span class=cm-type>${m}</span>`)
    .replace(/\d+/g, m => `<span class=cm-number>${m}</span>`);
}

window.onload = type;
</script>
</body>
</html>
复制代码

自用好看高级的404页面源码

马上注册，结交更多好友，享用更多功能，让你轻松玩转小K网。

相关帖子

回复