如何使div充满浏览器窗口

从互联网访问了很多网站后，我无法找到方式，我怎样才能制作一个填充浏览器窗口的div。首先它应该被隐藏，但在回发时应该是可见的。这个div不是body标签的直接子代，而是放置在表格行内。我应该使用什么样的CSS来定位以适应窗口。我在Css以下使用div但不适用于我。如何使div充满浏览器窗口

.BodyCover { position: absolute; 
    top: 0; 
    right: 0; 
    width: 100%; 
    height: 100%; 
    }

编辑

和HTML标记是下面，

<table> 
    <tr> 
     <td>Content</td> 
    </tr> 
    <tr> 
     <td>Content</td> 
    </tr> 
    <tr> 
     <td><div class="BodyCover "></div></td> 
    </tr> 
</table>

我如何可以通过两种方式实现，这意味着我想有DIV一样浮在身上事件的一些按钮点击。这怎么可能通过另一种方式。

来源

2012-12-20 Rajaram Shelar

尝试最小宽度：100％; –

为什么你会用'table'里面的元素覆盖100％的窗口？ put是'body'的第一个或最后一个后裔。 –

基于百分比的宽度和高度是相对于包裹元素（所以位置绝对的方式），所以如果你想你的div覆盖整个身体，你别无选择，只能使它成为身体的直接后代，或者使用javascript手动更改div的大小和位置。

有趣的问题是，为什么你想一个div是一个表的一部分，而是覆盖整个屏幕...

来源

2012-12-20 08:15:52 TheZuck

试试这个，工作对我来说

.BodyCover { 
position: absolute; 
top: 0; 
right: 0; 
bottom:0; 
left:0; 
}

http://jsfiddle.net/jeL3D/

来源

2012-12-20 08:16:01

你可以做到这一点;

body{ 
    height:100%; 
    margin:0; 
} 

.full{ 
    display:block; 
    top:0; 
    left:0; 
    width:100%; 
    height:100%; 
    background:#F00; 
    position:absolute; 
    visibility:hidden; 
} 
<table border="1"> 
    <tr> 
     <td id="rw"><div class="full" id="dv">text here</div>click</td> 
     <td><div>text1</div></td> 
    </tr> 

    <tr> 
     <td><div>text2</div></td> 
     <td><div>text3</div></td> 
    </tr> 
</table>

http://jsfiddle.net/MvtYU/19/

来源

2012-12-20 08:18:57 midstack

我的DIV在表格行 –

试试这个http://jsfiddle.net/MvtYU/6/ – midstack

（body ...）ok margin，...但是为什么'padding：0;'？ 'body'有一些默认的填充是害怕的吗？ –

现在，您可以使用视口的高度和宽度视 - VH和大众分别。例如，100vh填充视口窗口的高度。

来源

2014-06-29 05:20:37 JSeligsohn

如何使div充满浏览器窗口

回答

相关问题