定制简单的404和403页面
404页面,倒计时自动跳转指定页面
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>404</title> <style> html, body { padding: 0; margin: 0; height: 100%; } .box { width: 100%; height: 100%; background-color: wheat; text-align: center; /*文本水平居中*/ padding-top: 15%; } </style> </head> <body> <div class="box"> <h1>404 您进入了无人区...</h1> <span id="counter"></span>秒后 <a href="http://www.baidu.com">返回百度首页</a> </div> <script> var $counter = document.getElementById('counter'); function countDown(secs) { $counter.innerText=secs; if(--secs>0) { setTimeout("countDown("+secs+")",1000); } if(secs==0) { location.href = 'http://stat.hcdn.qiyi.domain'; } } countDown(5); </script> </body> </html>
403页面文字水平垂直居中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>403</title> <style> html, body { padding: 0; margin: 0; height: 100%; } .box { width: 100%; height: 100%; background-color: wheat; text-align: center; /*文本水平居中*/ line-height: 600px; /*文本垂直居中*/ } </style> </head> <body> <div class="box"> <h1 style="display: inline">Sorry, this page is Authorised by </h1> <h1 style="display: inline"><a href="http://home.baidu.domain/">Baidu Internal Network</a></h1> <h1 style="display: inline"> only.</h1> </div> </body> </html>