关键点在于<html>标签和js、<!--[if lt IE 10]>的配合
使用360浏览器兼容模式下查看:http://runjs.cn/code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>浏览器不被支持</title> <style> body{background-color: #2b3a41;color: #fff;font-family: 微软雅黑, Verdana, sans-serif, 宋体;} ul, li, h1, p{padding: 0;margin: 0;} .ieError{margin: 0 auto;width: 500px;margin-top: 100px;} .erroeMessage{height: 100px;} .ieError em{display: block;font-style: normal;font-size: 33px;font-weight: bold;color: #ff0;} .browser ul{list-style: none;} .browser p{height: 30px;} .browser li{float: left;margin-right: 30px;} .browser img{border:0;} </style> <!--[if lt IE 10]> <script type="text/javascript"> var unsupport = true; </script> <![endif]--> <script type="text/javascript"> if(typeof unsupport == "undefined"){ location.href = "/"; } </script> </head> <body> <div class="ieError"> <div class="erroeMessage"> <em>Oh, no!</em> 不支持 IE10 以下浏览器! </p> </div> <div class="browser"> <p>建议安装以下浏览器:</p> <ul> <li><a href="http://www.google.cn/intl/zh-CN/chrome/browser/" title="下载chrome"><img src="assets/images/supper/chrome.png" /></a></li> <li><a href="http://firefox.com.cn/" title="下载Firefox"><img src="assets/images/supper/firefox.png" /></a></li> <li><a href="http://www.apple.com.cn/safari/" title="下载safari"><img src="assets/images/supper/safari.png" /></a></li> <li><a href="http://cn.opera.com/" title="下载opera"><img src="assets/images/supper/opera.png" /></a></li> </ul> </div> </div> </body> </html>