如何让div填充满父容器：绝对定位和Flex布局 | CSS技巧

///'如何使得div填充满整个父容器内容：您可以使用CSS的height和width属性来实现div填充满整个父容器的效果。以下是两种常见的方法：//n//n1. 使用绝对定位（Absolute Positioning）：//n - 父容器需要设置position: relative;，这样子元素的绝对定位将相对于父容器进行。//n - div元素需要设置position: absolute;，并使用top: 0;、bottom: 0;、left: 0;、right: 0;来将其边界与父容器的边界对齐。//n - div元素还需要设置height和width为100%以填充满整个父容器。//n//n 示例代码：//n html//n <div class=/'parent/'>//n <div class=/'child/'></div>//n </div>//n //n css//n .parent {//n position: relative;//n height: 200px;//n width: 300px;//n }//n//n .child {//n position: absolute;//n top: 0;//n bottom: 0;//n left: 0;//n right: 0;//n height: 100%;//n width: 100%;//n background-color: red;//n }//n //n//n2. 使用flex布局（Flexbox Layout）：//n - 父容器需要设置display: flex;，这样子元素将自动填充整个父容器。//n - div元素需要设置flex: 1;，这样它将占据父容器的所有可用空间。//n//n 示例代码：//n html//n <div class=/'parent/'>//n <div class=/'child/'></div>//n </div>//n //n css//n .parent {//n display: flex;//n height: 200px;//n width: 300px;//n }//n//n .child {//n flex: 1;//n background-color: red;//n }//n //n//n这些方法都可以实现div填充满整个父容器的效果，请根据您的具体需求选择适合的方法。//n//n/