极简 404 页面 HTML 模板是一款非常简洁的静态 HTML 页面,适用于任何网站或项目。该模板只包含一个主要区域,用于显示 404 错误消息和提示用户如何解决问题。
该模板的设计风格简约、现代、直观,包含少量 CSS 样式规则,可以轻松自定义。在代码实现方面,该模板基于 HTML5 和 CSS3 构建,使用流行的 Flexbox 布局技术进行布局。
该模板不仅易于使用和自定义,还可以快速加载并在任何设备上正确显示。此外,该模板不依赖于任何 JavaScript 或服务器端代码,因此非常易于集成到您的项目中。
源代码:
<!DOCTYPE html>
<html>
<script type="text/javascript">
function loc() {
var browserLanguage = (navigator.language) ? navigator.language : navigator.userLanguage;
var t, h, p;
switch (browserLanguage.toLowerCase()) {
case "en-us":
t = "WAP Websites - Site Error";
h = "Error 404 - Web Site not found!";
p = "The site you have attempted to reach is not available.";
break;
case "de-de":
t = "WAP Websites - Site Error";
h = "Fehler 404-Website nicht gefunden!";
p = "Die Webseite, die Sie versucht haben, zu erreichen ist nicht verfügbar";
break;
case "es-es":
t = "WAP Websites - Site Error";
h = "Error 404 - ¡Sitio inexistente!";
p = "El sitio que ha intentado visitar, no se encuentra disponible.";
break;
case "fr-fr":
t = "WAP Websites - Site Error";
h = "Erreur 404 – Site Web non trouvé !";
p = "Le site que vous avez tenté d'atteindre n'est pas disponible";
break;
case "it-it":
t = "WAP Websites - Site Error";
h = "Errore 404 – sito non trovato!";
p = "Si è tentato di raggiungere il sito non è disponibile";
break;
case "ja-jp":
t = "WAP Websites - Site Error";
h = "エラー 404-Web サイトが見つかりません!";
p = "到達しようとしているサイトが使用できません。";
break;
case "ko-kr":
t = "WAP Websites - Site Error";
h = "오류 404-웹 사이트를 찾을 수 없습니다!";
p = "에 도달 하려고 했습니다 사이트는 사용할 수 없습니다.";
break;
case "pt-br":
t = "WAP Websites - Site Error";
h = "Erro 404 – Web Site não encontrado!";
p = "O site que você tentou chegar, não está disponível";
break;
case "ru-ru":
t = "WAP Websites - Site Error";
h = "Ошибка 404 - Сайт не найден!";
p = "Сайт не найден.";
break;
case "zh-hans":
t = "WAP Websites - Site Error";
h = "错误 404 – 网站上找不到 !";
p = "您已尝试达到该网站不可用";
break;
case "zh-hant":
t = "WAP Websites - Site Error";
h = "錯誤 404 – 網站上找不到 !";
p = "您已嘗試達到該網站不可用";
break;
default:
t = "WAP Websites - Site Error";
h = "Error 404 - Web Site not found!";
p = "The site you have attempted to reach is not available.";
}
document.title = t;
document.getElementById("siteCreated").innerHTML = h;
document.getElementById("goDo").innerHTML = p;
}
</script>
<head><title>WAP Websites - Site Error</title>
<style type="text/css">
html { height: 100%; width: 100%; }
#feature { width: 960px; margin: 95px auto 0 auto; overflow: auto; }
#content { font-family: "Segoe UI"; font-weight: normal; font-size: 26px; color: #ffffff; float: left; width: 460px; margin-top: 68px; margin-left: 0px; vertical-align: middle; }
#content h1 { font-family: "Segoe UI Light"; color: #ffffff; font-weight: normal; font-size: 70px; line-height: 48pt; width: 800px; }
p a, p a:visited, p a:active, p a:hover { color: #ffffff; }
#content a.button { background: #0DBCF2; border: 1px solid #FFFFFF; color: #FFFFFF; display: inline-block; font-family: Segoe UI; font-size: 24px; line-height: 46px; margin-top: 10px; padding: 0 15px 3px; text-decoration: none; }
#content a.button img { float: right; padding: 10px 0 0 15px; }
#content a.button:hover { background: #1C75BC; }
</style>
</head>
<body bgcolor="#00abec" onload="loc();">
<div id="feature">
<div id="content">
<h1 id="siteCreated">Error 404 - Web Site not found!</h1>
<p id="goDo">The site you have attempted to reach is not available.</p>
</div>
</div>
</body>
</html>
该模板的代码非常简单,主要包括一个网页标题、一个 h1 标题、一个短段落和一个链接。你可以按需修改这些元素的内容和样式,以确保它们符合你的品牌和设计要求。
1.使用本站下载的源码仅限于个人学习和非商业用途。
2.禁止将本站下载的源码用于搭建或支持任何违法、淫秽、暴力或侵犯他人合法权益的网站或应用。
3.使用本站下载的源码需遵守国家法律法规及相关规定,不得从事任何违法活动。
4.如若本站内容侵犯了原著者的合法权益,请联系我们进行处理。
评论(0)