用HTML设计一个404页面
时间: 2024-09-07 16:02:10 浏览: 61
404_一个简单的404页面_
设计一个404错误页面是网站维护中的一部分,用于提升用户体验,当用户访问一个不存在的页面时,404页面会告诉用户该页面无法找到,并且可以引导用户返回网站的其他部分。
以下是一个简单的HTML 404页面的示例代码:
```html
<!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.0">
<title>404页面不存在</title>
<style>
body {
text-align: center;
padding: 100px;
font-family: "Arial", sans-serif;
}
h1 {
color: #ff6666;
}
p {
font-size: 16px;
}
a {
color: #3498db;
text-decoration: none;
font-weight: bold;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<h1>404 错误</h1>
<p>抱歉,您访问的页面不存在。</p>
<p>点击<a href="/">返回首页</a>或使用下面的链接导航到网站的其他部分。</p>
<!-- 导航菜单示例 -->
<nav>
<ul>
<li><a href="/index.html">首页</a></li>
<li><a href="/about.html">关于我们</a></li>
<li><a href="/contact.html">联系我们</a></li>
</ul>
</nav>
</body>
</html>
```
这个页面包含了基本的HTML结构,并通过CSS进行了简单的样式设计。页面中有404错误提示信息、一个返回首页的链接以及一个导航菜单,方便用户访问其他页面。
阅读全文