效果图
代码
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Viewport metatags -->
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="320" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" type="text/css" href="https://cdn1.waajg.cn/404/css/dandelion.css" media="screen" />
<title>你访问的页面不见啦！-404</title>
</head>
<body>
<!-- Main Wrapper. Set this to 'fixed' for fixed layout and 'fluid' for fluid layout' -->
<div id="da-wrapper" class="fluid">
<!-- Content -->
<div id="da-content">
<!-- Container -->
<div class="da-container clearfix">
<div id="da-error-wrapper">
<div id="da-error-pin"></div>
<div id="da-error-code">
error
<span>404</span>
</div>
<h1 class="da-error-heading">哎哟喂！页面让狗狗叼走了！</h1>
<center>
<a href="https://www.waajg.cn"><h1>访问博客</h1></a>
<a href="http://home.waajg.cn">访问主页</a>
</center>
</div>
</div>
</div>
<!-- Footer -->
<div id="da-footer">
<div class="da-container clearfix">
<p> Copyright © 2019. All Rights Reserved. 安城网络 </p>
</div>
</div>
</div>
</body>
</html>css 和图片已外链接化，介意的小伙伴可以自己保存到本地！
还有一种更为简单的【直接上代码】
<!DOCTYPE html>
<html style="height:100%">
<head>
<title>404 Not Found</title>
</head>
<body style="color: #444; margin:0;font: normal 14px/20px Arial, Helvetica, sans-serif; height:100%; background-color: #fff;">
<div style="height:auto; min-height:100%; ">
<div style="text-align: center; width:800px; margin-left: -400px; position:absolute; top: 30%; left:50%;">
<h1 style="margin:0; font-size:150px; line-height:150px; font-weight:bold;">404</h1>
<h2 style="margin-top:20px;font-size: 30px;">Not Found</h2>
</div>
</div>
</body>
</html>效果图如下
