经常输入资源名称错误时，会出现界面找不到的情况，很不友好，编写一个404界面找不到时的显示界面

查看相关知识

查看相关练习

要求：

经常输入资源名称错误时，会出现界面找不到的情况，很不友好，编写一个404界面找不到时的显示界面

实现步骤：

创建动态的 Java Web 项 目

在 WebContent 目录内，创建 HTML5 文件“404.html”，编写界面代码

配置 Eclipse 的 Tomcat 服务器，并部署项目“Java_web_01”。启动 Tomcat 服务器

在浏览器地址栏输入界面访问URL，测试是否能正常访问

404.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网页访问不了</title>
<style type="text/css">
	*{
		margin: 0;
		padding: 0;
		box-sizing: 0;
	}
	body{
		background-color: #ededef;
		font-family: "楷体";
	}
	#warp{
		padding: 200px 0px;
		display: flex;
		justify-content: center;
	}
	.left{
		padding: 150px;
		background: url(img/bg.jpg) no-repeat;
		background-size: 80% 80%;
		background-position: right;
	}
	.left_img{
		text-align: right;
		float: left;
		background: url(img/bg.jpg) no-repeat;
	}
	.right{
		line-height: 30px;
		margin: auto 50px;
	}
	.right h3{
	}
	.reason,.oper{
		margin-top: 20px;
	}
</style>
</head>
<body>
	<div id="warp">
		<div class="left">
			<div class="left_img"></div>
		</div>
	
		<div class="right">
			<h3 class="title">啊哦，你所访问的页面不存在，可能是炸了</h3>
			<div class="reason">
				<p>可能的原因:</p>
				<p>1、手抖打错了</p>
				<p>2、链接过了保质期</p>
			</div>
			<div class="oper">
				<p><a href="javascript:histor.go(-1)">返回上一级页面</a></p>
				<p><a href="#">回到网站首页</a></p>
			</div>
		</div>
	</div>
</body>
</html>

源代码：点击查看

posted @ 2021-02-23 21:11  明金同学  阅读(39)  评论(0)  编辑  收藏  举报