设置主体宽度，与客户端窗口相同

Question

我正在寻找的是一种使用 JAVA 设置与客户端窗口相同的正文宽度的方法。这段代码是我从 W3S 借来的，但它在我的情况下不起作用 -

function body_width(w)
{
var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var x = document.body;
x.style.width = w;
}
window.onload = body_width(w);

我也给了身体"style="width:;" "

Answer 1

你试过使用 screen.availWidth 和 screen.availHeight 吗？

screen.availHeight 属性返回访问者屏幕的高度（以像素为单位），减去 Windows 任务栏等界面功能。

screen.availWidth 属性返回访问者屏幕的宽度（以像素为单位）减去 Windows 任务栏等界面功能。

它可以通过视口百分比长度轻松完成：

视区百分比长度相对于初始包含块的大小。当初始包含块的高度或宽度发生更改时，它们会相应地缩放。

.HTML

<div>Your Container</div>

和 CSS

div {
        height:100vh;
    }

这就是你所需要的。

下面是 JSFiddle 示例。

Answer 2

尝试以%为单位设置宽度：

<style>
Body{
   width:100%;
}
</style>

Answer 3

不是window.onload = body_width(w);

它window.onload = body_width;

Answer 4

这个选项完美地解决了。

<script>
function body_width(w)
{
var w = screen.availWidth
var x = document.body;
x.style.width = screen.availWidth + "px";
}
window.onload = body_width;
</script>

谢谢 2 ivarz_LV

Answer 5

当我测试时，使用

body {
 height: 100%;
}

行不通。尝试在style中使用它：

body {
 height: 100vh;
}

我认为使用vh会更好。