首页 > 如何让高度自适应所有屏幕?

如何让高度自适应所有屏幕?


这是PC上。
但是在手机上,就会有滚动条。
因为我设置height=600px;

但是我希望在手机上也不需要滑动,感觉很不爽。
请问这个怎么解决呢?


有朋友说用body fixed,测了下,貌似没用。


最后还是用js,设置高度为window.innerHeight解决了,谢谢大家。


body{
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
}


使用media queries,例如:

/* for 480px or less*/
@media screen and (max-width:480px) {
    body {height:auto;}
}

html {height: 100%;}
body {height: 100%;}
//去滚动条
::-webkit-scrollbar {
width: 0;
height: 0;
}


可以试试用 CSS3 的长度单位 vh 设置高度。
相对于视口的高度。视口被均分为100单位的vh。高度占满整个窗口就是height: 100vh


我一般是在css开始的部分添加
body,html{
height:100%;
}
然后在接下来的部分中,你就可以通过百分比来控制页面中其他部件的高度了,如果没有设置这个高度100%的话,在后面用百分比来设置页面内部高度的话是不行的好像。


CSS:

body {
    position: fixed;
}

题主又说:

我想达到的是某元素高度=任何屏幕的高度,也就是说动态变化

这就是问题没描述清楚嘛,这种需求用 js 解决最简单。


怎么用js 控制啊, 请楼主赐教。。。。怎样设置高度,自适应 手机端、平板等~

【热门文章】
【热门文章】