Css 如何使子元素/组件忽略其父元素/组件的大小？

我正在渲染组件B（标题）内部的组件A（全屏覆盖）。我将组件A指定为

高度：100vh

，它实际上是我屏幕的高度，只是它被标题的大小向下推

我希望它既能覆盖整个屏幕的高度，又能覆盖整个屏幕，但不需要指定

页眉顶部边距：-$（页眉大小）

如何执行此操作？

使用属性

position

和值

fixed

。 如注释中所述，您可以使用

位置

属性，如下所示：

测试

。组件a{
位置：固定；//我们将其设置为相对于视口的位置。
顶部：0；//内容框的上边缘到顶部位置0
右：0；//内容框的右边缘到右位置0
底部：0；//内容框的底部边缘到底部位置0
左：0；//内容框的左边缘到左位置0
}

正如您所看到的，我们现在已经确定了将具有componentA类的div的内容框边缘定位在视口的零点（顶部、右侧、底部、左侧）。如果这有道理的话

关于位置：固定（来自）

具有

位置的元素：固定相对于视口定位，这意味着即使滚动页面，它也始终保持在同一位置。顶部、右侧、底部和左侧属性用于定位图元

视口（来自）

视口是用户当前可以看到的网页的一部分。滚动条移动视口以显示页面的其他部分

更具体地说，视口与屏幕分辨率或浏览器窗口的大小无关；它仅指用户在任何给定时间都可以看到网页的空间。
您是否尝试过
位置：固定或
位置：绝对？谢谢！将
位置
设置为固定，
顶部
设置为0，
宽度
设置为100%工作！只是现在我不能再访问按钮组件，我用来安装覆盖在第一位。。。摆弄z指数，但结果一无所获。您是否知道我可能会如何提高单个组件，使其“高于”此定位固定覆盖（即组件A的顶部）。将组件b设置为z索引：0，然后将组件A设置为1，最后将按钮组件设置为z索引3。如果我的回答对你有帮助，请友善地将其设置为“已回答”：@ZeyadShaban答案与反应无关，所以我不明白你为什么抱怨。