Question

我的网站是barkitv.com/barki/register-3在一些大屏幕上有白色空间我不想要任何空白区域我希望它适合整个屏幕没有任何空白区域，这就是我所拥有的尝试将内容100％制作并使页脚与125552552 126382233 454654654 548652545 876544545一起显示在底部但是仍有空格我还尝试position:absolute bottom:0;并在页脚上执行min-height: 100%;。

谢谢

Answer 1

添加此CSS：

html {height: 100%;}
body {min-height: 100%; background: black;}

Answer 2

试试这个：

body {
  height: 100vh;
}

如果您希望缩短包含页脚，只需减少数字。

您可能需要定位身体以外的其他元素。

像这样：

.content {
  height: 90vh;
}

Answer 3

您只需将.content div的高度设置为100%即可。但更好的解决方案是将body的{{1}}设置为background-color的背景颜色。

.content

Answer 4

看起来你已经实现了粘性页脚。只需在正文上设置背景颜色以匹配您的内容区域：

body {
    background: black;
}

Answer 5

首先，html和body标记是块元素，它们的高度会尽可能小地折叠。

让它们占据整个窗口：

html, body {
  height: 100%;
}

其次，默认情况下body标记的margin为8像素。

删除它并使其包含的元素右移到边缘：

body {
  margin: 0;
}

此处示例：https://jsfiddle.net/3u8kqvxo/

请注意，您实际上并不想使用像这样的无所不包的包装器，它是多余的，因为它基本上只是另一个body。

但是，对于您的页脚问题，这是一个非常好的解决方法，可以让您有理由使用它：https://jsfiddle.net/3u8kqvxo/1/

使页面填满整个屏幕，根本没有空白区域

5 个答案: