javascript - 如何调整内部 div 的大小以使区域占据屏幕的 100%

Question

我有一个这样的页面：

<body>
<div class="outerdiv">
<div class="someDiv">
<div class="flexible"></div>
</div>
<div class="someOtherDiv"></div>
</div>
</body>

我需要编写 css 和 javascript，通过调整灵活 div 的大小，使这个布局占据屏幕的 100%。

我特别欣赏可以处理复杂场景的解决方案，其中灵活的 div 嵌套在其他 div 中，并且内容是事先未知的。

score 1 · Accepted Answer

默认情况下，div 是其容器宽度的 100%。因此，如果保持灵活的容器不是文档的 100% 宽度，则不会。您可以定位 absolute 并为其指定特定宽度，但必须随着窗口的增长或缩小而更改它。

<script>
$(window).resize(function(){
  var windowWidth =  $(window).width();
  $(".flexible").width(windowWidth);
});
</script>

1 回答 1