配置 web.config
<?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <urlCompression doStaticCompression="true" doDynamicCompression="true" /> <defaultDocument> <files> <clear /> <add value="index.html" /> <add value="index.asp" /> <add value="index.php" /> <add value="default.aspx" /> <add value="default.asp" /> <add value="index.htm" /> <add value="index.aspx" /> <add value="default.php" /> <add value="default.html" /> </files> </defaultDocument> <httpErrors> <remove statusCode="404" subStatusCode="-1" /> <error statusCode="404" prefixLanguageFilePath="" path="/404.html" responseMode="ExecuteURL" /> </httpErrors> </system.webServer> </configuration>
?
404 页面
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=2.0" /> <title>404页面</title> <meta http-equiv="refresh" content="3; URL=/" /> <style type="text/css"> *{ margin:0; padding:0; } body{ font-family:\5FAE\8F6F\96C5\9ED1,‘Arial‘; } .box{ width:320px; margin:20px auto 0 auto; text-align:center; } .img{ width:238px; height:239px; display:block; margin:0 auto; } .box h1{ font-size:36px; color:#848484; line-height:56px; border-bottom:1px solid #cacaca; } .cont{ font-size:18px; color:#848484; line-height:60px; } .btn{ height:80px;} .btn a{line-height:40px; height:40px; width:86px; color:#777777; background-color:#ededed; font-size:16px; font-weight:normal; font-family:Arial; background:-webkit-gradient(linear, left top, left bottom, color-start(0.05, #ededed), color-stop(1, #f5f5f5)); background:-moz-linear-gradient(top, #ededed 5%, #f5f5f5 100%); background:-o-linear-gradient(top, #ededed 5%, #f5f5f5 100%); background:-ms-linear-gradient(top, #ededed 5%, #f5f5f5 100%); background:linear-gradient(to bottom, #ededed 5%, #f5f5f5 100%); background:-webkit-linear-gradient(top, #ededed 5%, #f5f5f5 100%); border:1px solid #dcdcdc; -webkit-border-top-left-radius:6px; -moz-border-radius-topleft:6px; border-top-left-radius:6px; -webkit-border-top-right-radius:6px; -moz-border-radius-topright:6px; border-top-right-radius:6px; -webkit-border-bottom-left-radius:6px; -moz-border-radius-bottomleft:6px; border-bottom-left-radius:6px; -webkit-border-bottom-right-radius:6px; -moz-border-radius-bottomright:6px; border-bottom-right-radius:6px; -moz-box-shadow: inset 0px 0px 0px 0px #ffffff; -webkit-box-shadow: inset 0px 0px 0px 0px #ffffff; box-shadow: inset 0px 0px 0px 0px #ffffff; text-align:center; display:inline-block; text-decoration:none; } </style> </head> <body> <div class="box"> <p class="img"><img src="images/404.png"></p> <h1>哎呀,出错了!</h1> <p class="cont">请稍等,系统正为您返回首页</p> <p class="btn"><a href="/">返回首页</a></p> </div> </body> </html>
?
效果图:
?
原文:http://onestopweb.iteye.com/blog/2259821