SOURCE

console 命令行工具 X clear

                    
>
console
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>demo</title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
        crossorigin="anonymous"></script>
    <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        body,
        html {
            width: 100%;
            height: 100%;
        }

        body {
            font-size: 14px;
        }

        div {
            /* margin: 0 20px 20px; */
        }

        .a {
            width: 10rem;
            height: 1rem;
            background: blue;
        }

        .b {
            position: relative;
        }

        @media (-webkit-min-device-pixel-ratio: 1) {
        }
        @media (-webkit-min-device-pixel-ratio: 2) {
        }
        @media (-webkit-min-device-pixel-ratio: 3) {
        }
    </style>
</head>

<body>
    <div class="a">111</div>
    <div class="b border-line">555</div>
</body>
<script>
    $(function () {
        $('body').append('设备像素比:' + window.devicePixelRatio)
        $('body').append('<br>屏幕宽度:' + $(window).width())
    })
</script>

</html>