html/css：将div边界框设置为窗口高度

它看起来像我缺少一些基本的东西。我想要某个DIV具有窗口的高度。效果应该是没有任何需要向下滚动。html/css：将div边界框设置为窗口高度

我必须使用JavaScript吗？我被告知可能用CSS，但我找不到相关的属性 - 或者我做错了什么。

来源

2010-05-25 noamtm

我必须使用JavaScript吗？我是告诉它可能与CSS，但我无法找到相关的属性 - 或我做错了什么。

JavaScript是要走的路，你不能用css确定winodow大小，并根据窗口大小重新计算。

来源

2010-05-25 06:46:37 Sarfraz

呃，他可以，如果维度是基于百分比，而不是px。 – annakata 2010-05-25 06:53:33

这是使用方法：

body { 
    margin:0; 
    padding:0; 
    height:100%; /* this is the key! */ 
} 

.yourDivStyle { 
    ... 
    height: 100%; 
}

来源

2010-05-25 06:49:36 Strelok

这不起作用。如果它是身体的直接孩子，这将使DIV具有与身体相同的尺寸。请记住，html正文与窗口高度不一样。 Javascript是去这里的路。 – Pablo 2010-05-25 06:54:32

@Pablo，那么解决方案是什么？ – user1736947 2014-06-02 17:34:18

-1

好了，在Javascript中（不是jQuery的或任何东西）：

<html> 
<head> 
<script type="text/javascript"> 
<!-- 

var sWidth; 
var sHeight; 


if (typeof window.innerWidth != 'undefined') 
{ 
     sWidth = window.innerWidth, 
     sHeight = window.innerHeight 
} else if (typeof document.documentElement != 'undefined' 
    && typeof document.documentElement.clientWidth != 
    'undefined' && document.documentElement.clientWidth != 0) 
{ 
     sWidth = document.documentElement.clientWidth, 
     sHeight = document.documentElement.clientHeight 
} else 
{ 
     sWidth = document.getElementsByTagName('body')[0].clientWidth, 
     sHeight = document.getElementsByTagName('body')[0].clientHeight 
} 
//VARIABLES STORED IN sWidth AND sHeight 
document.write('<div style="height: '+sHeight+'; width: '+sWidth+';">CONTENT</div>'); 
//--> 
</script> 
</head> 
<body> 

</body> 
</html>

很明显，你可以写在div出来seperately^_^

来源

2010-05-25 08:20:51

如果你想关闭滚动，使用这个CSS：

html, body 
{ 
overflow: hidden; 
}

但现在请记住内容不会滚动 - 您可以将溢出：自动或溢出：如果您需要滚动，请在各个div上滚动。

如果您使用Javascript，请确保注册onresize事件，以便在窗口大小调整时更改数字。

来源

2010-05-25 08:27:46 hood

使所有父母都有height: 100%;或使用position: absolute /* or fixed */; left: 0; top: 0; width: 100%; height: 100%;。

来源

2010-05-25 09:06:50 reisio

html/css：将div边界框设置为窗口高度

回答

相关问题