Javascript 当使用绝对位置时，如何使vue组件中的div占据整个屏幕？

我的web应用程序是在Vue中制作的，因此当然要将内容分解为多个组件

正如您在这里看到的，在我的路由器视图中，当我显示一个我想要占据整个屏幕的弹出窗口时，它只占据了导航栏的一部分，并且占据了10vh

您可以在这里看到它：

所以我知道有一种方法可以解决这个问题：

将弹出div移动到App.vue文件中，并使用$emit命令它在按下按钮时显示。由于它位于App.vue文件中，因此将占用100vh

然而，我想知道是否有更简单的方法可以让div占据整个屏幕，即使它在路由器视图中而不是顶层？

代码示例（覆盖和列表项之一）：

元素并不是真正的“限制”到父母的边界。 您不能在比它小的父元素中插入元素，我将在右侧和底部溢出。 您可以使用负边距使其溢出，使其位于左侧顶部

#内部{
位置：固定；
高度：300px；
宽度：300px；
边框：4倍纯红；
余量：-100px 0-100px
}
#容器{
高度：800px；
宽度：100px；
边框：4倍纯黑；
保证金：100px 0px 0px 100px；
}

元素实际上并不“限于”父元素的边界。 您不能在比它小的父元素中插入元素，我将在右侧和底部溢出。 您可以使用负边距使其溢出，使其位于左侧顶部

#内部{
位置：固定；
高度：300px；
宽度：300px；
边框：4倍纯红；
余量：-100px 0-100px
}
#容器{
高度：800px；
宽度：100px；
边框：4倍纯黑；
保证金：100px 0px 0px 100px；
}

---

弹出窗口的高度可能为100vh，但它是否也位于顶部？ 还应设置“顶部”和“左侧”属性：

top: 0;
left: 0;

---

弹出窗口的高度可能为100vh，但它是否也位于顶部？ 还应设置“顶部”和“左侧”属性：

top: 0;
left: 0;

---

真不敢相信我没试过这个。我只是假设它默认为top:0 left:0。这么简单。非常感谢。真不敢相信我没试过这个。我只是假设它默认为top:0 left:0。这么简单。非常感谢。

top: 0;
left: 0;