404エラーページのサンプルHTMLコード
以下は、一般的な404エラーページのサンプルHTMLです。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 Error Page</title>
<style>
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
color: #333;
}
.container {
max-width: 960px;
margin: 0 auto;
padding: 50px 20px;
text-align: center;
}
h1 {
font-size: 72px;
margin-bottom: 40px;
}
p {
font-size: 24px;
margin-bottom: 20px;
}
a {
color: #0077cc;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class="container">
<h1>404</h1>
<p>The page you are looking for cannot be found.</p>
<p>Please check the URL or try using the search bar above.</p>
<a href="/">Go to the homepage</a>
</div>
</body>
</html>
このHTMLでは、一般的な404エラーページの見た目を再現しています。背景色はライトグレーで、フォントはArialで設定され、横幅は最大で960pxに設定されています。ページには「404」という大きな見出しがあり、その下に2つのメッセージと「Go to the homepage」というボタンが表示されます。また、CSSスタイルを使ってページのレイアウトとスタイルを設定しています。