经常我们会遇到发生页面404错误,服务器 500 异常,如果默认方式处理,则是将异常捕获之后跳到 Tomcat 缺省的异常页面,如下图所示。
不论哪个网站都是一样的,所以为了满足自定义的需要,Tomcat 也允许自定义样式的。也就是在 web.xml 文件中配置:
<!-- 404 页面不存在错误 --> <error-page> <error-code>404</error-code> <location>/notFound.jsp</location> </error-page> <!-- 500 服务器内部错误 --> <error-page> <error-code>500</error-code> <location>/notFound.jsp</location> </error-page>
最后就是去友好展示。
这是一个很简洁的404页面,只有一个网页,自带效果,非响应式设计
代码:
<!DOCTYPE html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>404错误页面不存在</title> <style type="text/css"> body,div,h3,h4,li,ol{margin:0;padding:0} body{font:14px/1.5 'Microsoft YaHei','微软雅黑',Helvetica,Sans-serif;min-width:1200px;background:#f0f1f3;} :focus{outline:0} h3,h4,strong{font-weight:700} a{color:#428bca;text-decoration:none} a:hover{text-decoration:underline} .error-page{background:#f0f1f3;padding:80px 0 180px} .error-page-container{position:relative;z-index:1} .error-page-main{position:relative;background:#f9f9f9;margin:0 auto;width:617px;-ms-box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:50px 50px 70px} .error-page-main:before{content:'';display:block;background:url(img/errorPageBorder.png?1427783409637);height:7px;position:absolute;top:-7px;width:100%;left:0} .error-page-main h3{font-size:24px;font-weight:400;border-bottom:1px solid #d0d0d0} .error-page-main h3 strong{font-size:54px;font-weight:400;margin-right:20px} .error-page-main h4{font-size:20px;font-weight:400;color:#333} .error-page-actions{font-size:0;z-index:100} .error-page-actions div{font-size:14px;display:inline-block;padding:30px 0 0 10px