浏览器版本不支持页面示例 supper.html

时间:2023-03-09 17:10:37
浏览器版本不支持页面示例  supper.html

关键点在于<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>

浏览器版本不支持页面示例  supper.html