1

从互联网上访问了许多站点后，我找不到方法，如何制作一个div填充浏览器窗口的方法。首先它应该被隐藏，但在回发时它应该是可见的。此 div 不是标记的直接子级，body而是放置在表格行内。我应该应用什么样的 css 以便它可以定位以适合窗口。我在下面Css使用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 像在身体事件上浮动一些按钮点击一样。这怎么可能通过另一种方式实现。

4

4 回答 4

0

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

于 2014-06-29T05:20:37.367 回答
0

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

有趣的问题是为什么您希望 div 成为表格的一部分但覆盖整个屏幕...

于 2012-12-20T08:15:52.743 回答
0

试试这个，为我工作

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

http://jsfiddle.net/jeL3D/

于 2012-12-20T08:16:01.027 回答
0

你可以这样做;

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-20T08:18:57.723 回答