<!DOCTYPE HTML>
<html>
<head>
    <title>Browser Recommend</title>
    <style type="text/css">
        .exp-content {
            margin:20px 30px 30px 20px;
            position:relative;
        }
        .exp-content .list-decimal-paddingleft-1 {
            padding: 5px 0px 5px 22px!important;
        }

        ol.custom_decimal li {
            background-position: 0 8px;
            background-repeat: no-repeat;
        }

        body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, textarea, th, td {
            margin: 0;
            padding: 0;
        }

        body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, textarea, th, td {
            margin: 0;
            padding: 0;
        }

        .list-exp-ul p, .custom_decimal p {
            margin: 0 0 25px;
        }

        .content-listblock-text p {
            margin: 20px 0;
        }

        .pic-cursor-pointer {
            cursor: pointer;
        }
        
        .custom_decimal .list-header  {
            padding: 5px 0px 5px 150px!important;
        }
        li.list-header {
            /*background-image: url(../images/center.png);*/
        }

        li.list-exp-ol-1 {
            background-image: url(../images/Ok.png);
        }

        li.list-exp-ol-2 {
            background-image: url(../images/Ok.png);
        }

        li.list-exp-ol-3 {
            background-image: url(../images/Ok.png);
        }

        li.list-exp-ol-4 {
            background-image: url(../images/Ok.png);
        }

        li.list-exp-ol-5 {
            background-image: url(../images/Ok.png);
        }
    </style>
</head>
<body>
    <div class="exp-content">
        <ol class="custom_decimal" style="list-style-type: none;">
            <li class="list-header" style="font-size:1.5em">Html5推荐使用的浏览器类型:</li>
        </ol>
    </div>
    <div class="exp-content">
        <ol class="custom_decimal list-paddingleft-1" style="list-style-type: none;">
            <li class="list-exp-ol-2 list-decimal-paddingleft-1">
                <p>
                    Google Chrome浏览器, 简称Chrome,Google旗下浏览器。版本37及以上。 <br><br>
                    <span style="color:#FF0000">建议：请下载最新版本谷歌浏览器</span></p>
            </li>
			<!--<li class="list-exp-ol-1 list-decimal-paddingleft-1">
                <p>
                    Internet Explorer 简称IE,微软公司旗下浏览器。版本11及以上。<br><br>官网网址: 
                    <a href="http://windows.microsoft.com/zh-cn/internet-explorer/" target="_blank" >http://windows.microsoft.com/zh-cn/internet-explorer/</a></p>
            </li>-->
			<li class="list-exp-ol-3 list-decimal-paddingleft-1" style='display: none;'>
                <p>
                    Firefox浏览器,简称FF浏览器,Mozilla公司旗下浏览器。版本43及以上。 <br><br>官方网址: 
                    <a href="http://www.firefox.com.cn/download/#more" target="_blank" >http://www.firefox.com.cn/download/#more</a></p>
            </li>
            <li class="list-exp-ol-4 list-decimal-paddingleft-1">
                <p>
                    Safari浏览器,苹果公司旗下浏览器,在苹果系统下是很优秀的浏览器。版本5及以上。 <br><br>(已停止对windows系统的支持，OS系统下很优秀的浏览器）。<br><br>
                    官方网址: 
                    <a href="http://www.apple.com/cn/safari/" target="_blank" >http://www.apple.com/cn/safari/</a></p>
            </li>
            <li class="list-exp-ol-5 list-decimal-paddingleft-1">
                <p>
                    Opera浏览器,Opera旗下浏览器。 版本27及以上。<br><br>官方网址: 
                    <a href="http://www.opera.com/zh-cn" target="_blank" >http://www.opera.com/zh-cn</a></p>
            </li>
            <li class="list-decimal-paddingleft-1" style="font-size:small">
                <p>
                    注：html5各功能的浏览器的支持情况，请参阅：<a href="http://caniuse.com" target="_blank" >http://caniuse.com</a></p>
            </li>
        </ol>
    </div>
    <div style="background-color: lightcyan;padding:15px 30px;font-size:0.8em;">
        <span>当前浏览器参数:</span>
        <span id="browserInfo" style="margin-left:15px;"></span>
        <script>
            (function getUserAgent() {
                document.getElementById('browserInfo').innerHTML = navigator ? navigator.userAgent : '[NULL]';
				if((navigator.userAgent || '').indexOf('compatible; MSIE')>0){
					
				}
            })();
        </script>
    </div>
</body>
</html>