css - 页面加载后如何使 DIV 填满整个屏幕

Question

我们正在为我们城市的 TEDx 创建一个网站，但我们被困住了..

这是它的草稿：tedx.mozerov.ru

我们有一个 div id="section-event" 我们希望在加载时用于整个页面。我们添加了高度：100%；和宽度：100％;，但该块仍然没有填满整个页面:(

请帮忙！

score 13 · Accepted Answer

好吧，不知道你将如何使用这个 div，但是：

position: absolute; top: 0; left: 0; height: 100%; width: 100%;

score 0 · Accepted Answer

将 height:100% 应用于 html 和 body 元素。我刚刚在FireBug中测试过，我认为它达到了你想要的效果。

score 0 · Accepted Answer

我仍然无法评论其他人的答案，所以这是我的答案，它只是对 uotonyh 的简单补充，可能会起作用。

使位置成为绝对位置并添加任意 z-index。只要 z-index 高于其他绝对/相对 DIV，它就应该占据整个视口。如果看到顶部和左侧有空格，则添加 margin: 0px; 到你的身体 css 标签。

前任。

#section-event {
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 99;
}

score 0 · Accepted Answer

这取决于您的网站布局，有时您会遇到不兼容的情况。但总的来说，这样的事情是有效的：

#redoverlay {
    background-color: red;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

我已经看到在某些<div id="redoverlay"></div>元素始终存在但其可见性被禁用的站点中使用了此方法。当它需要它的设置为 JavaScript 可见时。

score -2 · Accepted Answer

-2

你可能需要的margin: 0px是body

于 2013-06-15T00:17:26.083 回答

5 回答 5