移动端适配显示， 不同尺寸机型全屏适配显示， 图片bg 为底图，为保证在任何设备完整显示，高度设为100%， btn元素定位显示，如何保证btn在任何机型下，位置都能保证统一呢？求大神解答

Question

   <div style="background: #eee" class="box">
        <img class="bg" src="https://mediabook.oss-cn-shanghai.aliyuncs.com/cp.png" alt="">
        <div class="btn" > 1111
        </div>
    </div>
    <style >
    .box {
        height: 100vh;
        position: relative;
    }
    .box .bg {
        height: 100%;
        margin: 0 auto;
    }
    .btn {
        width: 100px;
        height: 100px;
        background: red;
        color: #fff;
        position: absolute;
        left: 100px;
        top: 100px;
    }
    </style>

Answer 1

用vh作为单位，vh，vw是指当前屏幕的百分比，要做通用化的，用百分比的单位比较合适