求助这个网页怎么实现自适应?

请教各位这个页面怎么实现让它在不同的手机端自适应屏幕去显示呢?

<html>
 <head></head>
 <body>

  <div class="wraper" style="width: 660px; height: 880px; position: absolute; left:0px; top:0px; overflow: hidden; ">
   <div class="text" style="width: 660px; height: 880px; position: absolute; left:0px; top:0px;">
    <div>
     <style type="text/css">.fs-2146a648-4 {font-size:17px; font-family:'Microsoft Yahei';  color:#28363e; position:absolute;} .fs-2146a648-a {font-size:17px; font-family:Arial;  color:#28363e; position:absolute;} .fs-2146a648-0 {font-size:26px; font-family:'Microsoft Yahei'; font-weight: 500; color:#28363e; position:absolute;} </style>
     <span class="fs-2146a648-4" style="left:147px; bottom:483px; ">。</span>
     <span class="fs-2146a648-4" style="left:148px; bottom:513px; ">东</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:649px; ">:</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:649px; ">版</span>
     <span class="fs-2146a648-4" style="left:442px; bottom:513px; ">P</span>
     <span class="fs-2146a648-a" style="left:328px; bottom:435px; "> </span>
     <span class="fs-2146a648-4" style="left:209px; bottom:708px; ">分</span>
     <span class="fs-2146a648-4" style="left:226px; bottom:708px; ">类</span>
     <span class="fs-2146a648-4" style="left:130px; bottom:708px; ">用</span>
     <span class="fs-2146a648-a" style="left:119px; bottom:649px; ">g</span>
     <span class="fs-2146a648-a" style="left:100px; bottom:561px; ">9</span>
     <span class="fs-2146a648-4" style="left:130px; bottom:619px; ">江</span>
     <span class="fs-2146a648-4" style="left:321px; bottom:513px; ">公</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:590px; ">时</span>
     <span class="fs-2146a648-4" style="left:580px; bottom:513px; ">限</span>
     <span class="fs-2146a648-a" style="left:172px; bottom:561px; ">5</span>
     <span class="fs-2146a648-4" style="left:252px; bottom:513px; ">传</span>
     <span class="fs-2146a648-a" style="left:183px; bottom:708px; ">0</span>
     <span class="fs-2146a648-4" style="left:304px; bottom:513px; ">限</span>
     <span class="fs-2146a648-4" style="left:390px; bottom:513px; ">北</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:678px; ">者</span>
     <span class="fs-2146a648-4" style="left:181px; bottom:619px; ">出</span>
     <span class="fs-2146a648-4" style="left:113px; bottom:678px; ">敏</span>
     <span class="fs-2146a648-4" style="left:192px; bottom:708px; ">词</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:513px; ">本</span>
     <span class="fs-2146a648-a" style="left:404px; bottom:435px; ">&middot;</span>
     <span class="fs-2146a648-a" style="left:251px; bottom:435px; ">&middot;</span>
     <span class="fs-2146a648-a" style="left:189px; bottom:590px; ">-</span>
     <span class="fs-2146a648-4" style="left:528px; bottom:513px; ">商</span>
     <span class="fs-2146a648-a" style="left:139px; bottom:649px; ">t</span>
     <span class="fs-2146a648-a" style="left:60px; bottom:561px; ">B</span>
     <span class="fs-2146a648-a" style="left:180px; bottom:590px; ">7</span>
     <span class="fs-2146a648-4" style="left:147px; bottom:619px; ">教</span>
     <span class="fs-2146a648-a" style="left:136px; bottom:561px; ">5</span>
     <span class="fs-2146a648-4" style="left:96px; bottom:513px; ">北</span>
     <span class="fs-2146a648-a" style="left:107px; bottom:649px; ">i</span>
     <span class="fs-2146a648-a" style="left:190px; bottom:561px; ">4</span>
     <span class="fs-2146a648-4" style="left:113px; bottom:619px; ">浙</span>
     <span class="fs-2146a648-4" style="left:494px; bottom:513px; ">电</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:619px; ">版</span>
     <span class="fs-2146a648-a" style="left:143px; bottom:649px; ">a</span>
     <span class="fs-2146a648-4" style="left:217px; bottom:513px; ">文</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:513px; ">书</span>
     <span class="fs-2146a648-4" style="left:113px; bottom:483px; ">发</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:649px; ">排</span>
     <span class="fs-2146a648-0" style="left:45px; bottom:754px; ">版</span>
     <span class="fs-2146a648-0" style="left:123px; bottom:754px; ">息</span>
     <span class="fs-2146a648-4" style="left:338px; bottom:513px; ">司</span>
     <span class="fs-2146a648-4" style="left:311px; bottom:435px; ">有</span>
     <span class="fs-2146a648-4" style="left:546px; bottom:513px; ">务</span>
     <span class="fs-2146a648-a" style="left:194px; bottom:590px; ">0</span>
     <span class="fs-2146a648-4" style="left:183px; bottom:513px; ">大</span>
     <span class="fs-2146a648-a" style="left:166px; bottom:590px; ">-</span>
     <span class="fs-2146a648-4" style="left:407px; bottom:513px; ">京</span>
     <span class="fs-2146a648-4" style="left:131px; bottom:513px; ">新</span>
     <span class="fs-2146a648-a" style="left:118px; bottom:561px; ">8</span>
     <span class="fs-2146a648-4" style="left:269px; bottom:513px; ">播</span>
     <span class="fs-2146a648-a" style="left:400px; bottom:435px; "> </span>
     <span class="fs-2146a648-a" style="left:256px; bottom:435px; "> </span>
     <span class="fs-2146a648-a" style="left:109px; bottom:561px; ">7</span>
     <span class="fs-2146a648-4" style="left:332px; bottom:435px; ">侵</span>
     <span class="fs-2146a648-a" style="left:128px; bottom:649px; ">S</span>
     <span class="fs-2146a648-a" style="left:130px; bottom:590px; ">2</span>
     <span class="fs-2146a648-4" style="left:96px; bottom:483px; ">与</span>
     <span class="fs-2146a648-4" style="left:366px; bottom:435px; ">必</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:590px; ">版</span>
     <span class="fs-2146a648-a" style="left:171px; bottom:590px; ">0</span>
     <span class="fs-2146a648-a" style="left:49px; bottom:561px; ">S</span>
     <span class="fs-2146a648-a" style="left:174px; bottom:708px; ">0</span>
     <span class="fs-2146a648-a" style="left:96px; bottom:649px; ">K</span>
     <span class="fs-2146a648-4" style="left:286px; bottom:513px; ">有</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:590px; ">出</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:483px; ">司</span>
     <span class="fs-2146a648-4" style="left:598px; bottom:513px; ">公</span>
     <span class="fs-2146a648-a" style="left:208px; bottom:561px; ">1</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:708px; ">:</span>
     <span class="fs-2146a648-a" style="left:409px; bottom:435px; "> </span>
     <span class="fs-2146a648-4" style="left:294px; bottom:435px; ">所</span>
     <span class="fs-2146a648-4" style="left:356px; bottom:513px; ">授</span>
     <span class="fs-2146a648-4" style="left:113px; bottom:708px; ">实</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:619px; ">出</span>
     <span class="fs-2146a648-4" style="left:425px; bottom:513px; ">P</span>
     <span class="fs-2146a648-4" style="left:130px; bottom:483px; ">行</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:483px; ">制</span>
     <span class="fs-2146a648-a" style="left:157px; bottom:590px; ">7</span>
     <span class="fs-2146a648-4" style="left:413px; bottom:435px; ">—</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:483px; ">作</span>
     <span class="fs-2146a648-a" style="left:181px; bottom:561px; ">4</span>
     <span class="fs-2146a648-4" style="left:113px; bottom:590px; ">:</span>
     <span class="fs-2146a648-4" style="left:96px; bottom:708px; ">超</span>
     <span class="fs-2146a648-4" style="left:260px; bottom:708px; ">记</span>
     <span class="fs-2146a648-4" style="left:277px; bottom:435px; ">权</span>
     <span class="fs-2146a648-a" style="left:127px; bottom:561px; ">7</span>
     <span class="fs-2146a648-4" style="left:229px; bottom:435px; ">—</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:708px; ">书</span>
     <span class="fs-2146a648-4" style="left:62px; bottom:708px; ">名</span>
     <span class="fs-2146a648-4" style="left:200px; bottom:513px; ">愚</span>
     <span class="fs-2146a648-4" style="left:349px; bottom:435px; ">权</span>
     <span class="fs-2146a648-a" style="left:45px; bottom:561px; ">I</span>
     <span class="fs-2146a648-a" style="left:165px; bottom:708px; ">0</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:513px; ">由</span>
     <span class="fs-2146a648-4" style="left:198px; bottom:619px; ">版</span>
     <span class="fs-2146a648-4" style="left:96px; bottom:590px; ">间</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:619px; ">社</span>
     <span class="fs-2146a648-a" style="left:199px; bottom:561px; ">6</span>
     <span class="fs-2146a648-4" style="left:114px; bottom:513px; ">京</span>
     <span class="fs-2146a648-a" style="left:203px; bottom:590px; ">1</span>
     <span class="fs-2146a648-4" style="left:83px; bottom:561px; ">:</span>
     <span class="fs-2146a648-4" style="left:165px; bottom:513px; ">方</span>
     <span class="fs-2146a648-4" style="left:459px; bottom:513px; ">科</span>
     <span class="fs-2146a648-4" style="left:164px; bottom:619px; ">育</span>
     <span class="fs-2146a648-a" style="left:247px; bottom:435px; "> </span>
     <span class="fs-2146a648-4" style="left:243px; bottom:708px; ">速</span>
     <span class="fs-2146a648-0" style="left:97px; bottom:754px; ">信</span>
     <span class="fs-2146a648-a" style="left:152px; bottom:649px; ">r</span>
     <span class="fs-2146a648-4" style="left:260px; bottom:435px; ">版</span>
     <span class="fs-2146a648-4" style="left:477px; bottom:513px; ">文</span>
     <span class="fs-2146a648-a" style="left:71px; bottom:561px; ">N</span>
     <span class="fs-2146a648-a" style="left:147px; bottom:708px; ">1</span>
     <span class="fs-2146a648-a" style="left:145px; bottom:561px; ">5</span>
     <span class="fs-2146a648-a" style="left:156px; bottom:708px; ">5</span>
     <span class="fs-2146a648-a" style="left:163px; bottom:561px; ">6</span>
     <span class="fs-2146a648-4" style="left:45px; bottom:678px; ">作</span>
     <span class="fs-2146a648-4" style="left:235px; bottom:513px; ">化</span>
     <span class="fs-2146a648-0" style="left:71px; bottom:754px; ">权</span>
     <span class="fs-2146a648-a" style="left:154px; bottom:561px; ">3</span>
     <span class="fs-2146a648-4" style="left:79px; bottom:678px; ">:</span>
     <span class="fs-2146a648-4" style="left:96px; bottom:678px; ">俞</span>
     <span class="fs-2146a648-4" style="left:215px; bottom:619px; ">社</span>
     <span class="fs-2146a648-4" style="left:563px; bottom:513px; ">有</span>
     <span class="fs-2146a648-a" style="left:110px; bottom:649px; ">n</span>
     <span class="fs-2146a648-4" style="left:383px; bottom:435px; ">究</span>
     <span class="fs-2146a648-a" style="left:139px; bottom:590px; ">0</span>
     <span class="fs-2146a648-4" style="left:96px; bottom:619px; ">:</span>
     <span class="fs-2146a648-a" style="left:148px; bottom:590px; ">1</span>
     <span class="fs-2146a648-4" style="left:130px; bottom:678px; ">洪</span>
     <span class="fs-2146a648-4" style="left:511px; bottom:513px; ">子</span>
     <span class="fs-2146a648-4" style="left:373px; bottom:513px; ">权</span>
    </div>
   </div>
  </div>
  

 </body>
</html>
阅读 184
评论
    2 个回答
    • 174

    flexible.js 这个库应该适合你这种情况

    示例代码:

     <head>
        <meta
          name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
        />
        <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js"></script>
      </head>
      相似问题
      推荐文章