首页 新闻 搜索 专区 学院

HTML 如何自适应,不显示滚动条

0
悬赏园豆:20 [已解决问题] 解决于 2016-03-10 10:40

banner 或者 网页整个尺寸大于 当前分辨率 ,如何自适应 ,不显示滚动条

irfanchen的主页 irfanchen | 初学一级 | 园豆:100
提问于:2015-06-03 21:51
< >
分享
最佳答案
0

1、在head里面加入这句话:<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">

2、导航采用百分比的方式

如果不想手写,可以尝试使用现有的比较优秀的框架,如jquerymobile、pintuer、bootstrap等等

收获园豆:10
Mr_逗逗 | 菜鸟二级 |园豆:288 | 2015-06-10 11:48
其他回答(4)
0

设置宽高100%

收获园豆:10
请叫我头头哥 | 园豆:9382 (大侠五级) | 2015-06-04 00:03
0

书店里面有书卖。要不然当当也行。

爱编程的大叔 | 园豆:30748 (高人七级) | 2015-06-04 00:04
0

强制不显示滚动条

奋奋奋 | 园豆:32 (初学一级) | 2015-06-04 09:22
0

用js获取浏览器的宽高  你这样试试

<!DOCTYPE HTML>
<html>
 <head>
  <title> New Document </title>
  <style>
    * {padding:0px;margin:0px;}
    html,body {width:100%;height:100%;overflow:hidden;}
    #box {height:100%;width:100%;padding:80px 0px 40px 0px;}
    #top{background:#33ff00;width:100%;height:80px;position:absolute;top:0px;left:0px;}
    #main {background:#ff0;padding-left:200px;position:relative;}
    #bottom{background:#33ff00;width:100%;height:40px;position:absolute;bottom:0px;left:0px;}
    #left{height:100%;width:200px;position:absolute;left:0px;background:#f0f;}
    #right {background:#0ff;}
  </style>
    <script>
        window.onload=function(){
            //var box = document.getElementById("box");
            var h = document.body.clientHeight - 120;
            var w = document.body.clientWidth - 200;
                                                         
            var main = document.getElementById("main");
            main.style.height = h + "px";

            var right = document.getElementById("right");
            right.style.height = h+"px";
            right.style.width = w+"px";
        }
    </script>
 </head>
 <body>

  <div id="box">
    <div id="top"></div>
    <div id="main">
        <div id="left"></div>
        <div id="right"></div>
    </div>
    <div id="bottom"></div>
  <div>
 </body>
</html>

 

</div>

Nopen | 园豆:165 (初学一级) | 2015-06-07 20:13
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册