现代化HTTP错误页面集合

一套精心设计的HTTP错误页面模板，覆盖4xx和5xx系列常见错误代码，提供一致的用户体验和实用的错误信息。

✅ 响应式设计 - 适配所有设备
✅ 统一风格 - 所有页面保持一致的视觉设计
✅ 实用信息 - 显示IP、位置、时间等有用信息
✅ 简洁操作 - 提供返回首页等便捷操作
✅ 轻量高效 - 无冗余代码，快速加载

• 401 Unauthorized
• 403 Forbidden
• 404 Not Found
• 405 Method Not Allowed
• 414 URI Too Long
• 416 Range Not Satisfiable
• 451 Unavailable For Legal Reasons

• 500 Internal Server Error
• 501 Not Implemented
• 502 Bad Gateway
• 503 Service Unavailable
• 504 Gateway Timeout

复制粘贴，自定义响应界面

如需要自定义css和js

<link rel="stylesheet" href="errorPage/error.css">
<script src="errorPage/error.js"></script>

修改为pages自定义的资源位置，或者直接使用我的https://error.hsred.cn/errorPage/error.css

1.2K Jul 20 12:59 401.html 1.2K Jul 20 12:59 403.html 1.2K Jul 20 12:59 404.html 1.2K Jul 20 12:59 405.html 1.2K Jul 20 12:59 414.html 1.2K Jul 20 12:59 416.html 1.2K Jul 20 12:59 451.html 1.2K Jul 20 12:59 500.html 1.2K Jul 20 12:59 501.html 1.2K Jul 20 12:59 502.html 1.2K Jul 20 12:59 503.html 1.2K Jul 20 12:59 504.html

1. 克隆仓库：

git clone https://github.com/your-repo/error-pages.git

2. 将文件复制到您的网站目录：

cp -r error-pages /your/web/root/errors

3. 配置服务器（以Nginx为例）：

error_page 404 /errors/404.html;
location = /errors/404.html {
    internal;
}

• HTML5 - 语义化结构
• CSS - 自定义样式
• JavaScript - 动态功能实现
• Git - 版本控制

• 优化错误页面地理位置展示功能
• 新增经纬度信息显示
• 完善中国台湾地区及多省份地名翻译映射
• 重构地理位置功能，使用预加载翻译库
• 简化页面设计，整合资源引用

/errors
├── 4xx/          # 客户端错误页面
│   ├── 401.html
│   ├── 403.html
│   └── ...
├── 5xx/          # 服务器错误页面 
│   ├── 500.html
│   ├── 501.html
│   └── ...
├── errorPage/     # 公共资源
│   ├── error.css
│   └── error.js
└── maintenance.html

修改errorPage/error.css调整样式，或编辑errorPage/error.js更改功能行为。

MIT License © 2025