<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<!-- 基础SEO标签 -->
<meta name="description" content="您访问的页面不存在，返回网站首页继续浏览">
<meta name="keywords" content="404页面,页面不存在">
<title>404 - 页面未找到</title>
<style>
/* 全局重置 */
*{margin:0;padding:0;box-sizing:border-box;}
body{
    background-color:#444;
    font-family:"Microsoft Yahei",Arial,sans-serif;
    font-size:14px;
    color:#eee;
    /* 页面垂直水平居中 */
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
}
/* 404大标题 */
h3{
    font-size:80px;
    font-weight:normal;
    margin-bottom:20px;
}
/* 提示文案 */
.tips{
    font-size:18px;
    margin-bottom:40px;
    letter-spacing:1px;
}
/* 按钮容器 */
.btn-box{
    display:flex;
    gap:20px;
}
/* 通用按钮样式 */
.btn{
    display:inline-block;
    padding:12px 30px;
    background:#666;
    color:#fff;
    text-decoration:none;
    border-radius:4px;
    transition: background 0.3s;
}
.btn:hover{
    background:#888;
}
/* 移动端适配 */
@media (max-width: 768px){
    h3{font-size:60px;}
    .tips{font-size:16px;}
    .btn{padding:10px 24px;}
}
</style>
</head>

<body>
    <h3>404</h3>
    <p class="tips">抱歉，您访问的页面不存在！</p>
    <div class="btn-box">
        <a href="/" class="btn">返回首页</a>
        <a href="javascript:history.back();" class="btn">返回上一页</a>
    </div>
</body>
</html>