404页面

2021-05-05

在 pubic 目录放置404.html,即可实现 404 功能

举例


 1<!DOCTYPE html>
 2<html lang="en">
 3	<head>
 4		<meta charset="UTF-8" />
 5		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
 6		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 7		<title>404 NOT Found</title>
 8		<meta name="robots" content="noindex,nofollow" />
 9		<link rel="stylesheet" href="/assets/css/output.css" />
10	</head>
11	<body>
12		<main>
13			<div class="h-screen flex flex-col justify-center items-center">
14				<div class="w-1/2 max-w-screen-sm mx-auto h-96 bg-white rounded-md shadow flex flex-col justify-center items-center">
15					<p class="bg-clip-text text-xl md:text-3xl text-transparent bg-gradient-to-r from-cyan-700 to-amber-300">
16						404 NOT Found
17					</p>
18					<img class="w-1/5 mx-auto py-5" src="/assets/img/svg/404.svg" />
19					<p class="w-1/2 h-10 leading-10 py-5 text-sm flex flex-row justify-around items-center">
20						<a class="text-cyan-700" href="/">首页</a>
21						<a class="text-cyan-700" href="javascript:history.back(-1)"> 返回上一页 </a>
22					</p>
23				</div>
24			</div>
25		</main>
26	</body>
27</html>