CSS父背景色没有填充子容器

是由于CSS中的背景色属性不会自动填充子容器的内容区域。当父容器设置了背景色，子容器的内容区域将会覆盖在父容器的背景色之上，而不会自动填充父容器的背景色。

解决这个问题的方法有两种：

1. 使用浮动或者定位：可以通过给子容器添加浮动或者定位属性，使其脱离文档流，从而让父容器的背景色填充子容器的内容区域。例如：

.parent {
  background-color: #f1f1f1;
  overflow: hidden; /* 清除浮动 */
}

.child {
  float: left; /* 或者使用 position: absolute; */
}

1. 使用伪元素：可以通过给父容器添加一个伪元素，并设置其为块级元素，并将其背景色设置为父容器的背景色，从而实现填充子容器的效果。例如：

.parent {
  position: relative;
  background-color: #f1f1f1;
}

.parent::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: inherit;
}

以上两种方法都可以解决父背景色没有填充子容器的问题。具体选择哪种方法取决于具体的布局需求和兼容性要求。

腾讯云相关产品和产品介绍链接地址：

• 云服务器（CVM）：提供弹性计算能力，满足各种业务需求。产品介绍链接
• 云数据库 MySQL 版（CDB）：提供稳定可靠的 MySQL 数据库服务。产品介绍链接
• 腾讯云 CDN：提供全球加速、安全稳定的内容分发网络服务。产品介绍链接
• 腾讯云对象存储（COS）：提供高可靠、低成本的云端存储服务。产品介绍链接
• 腾讯云人工智能（AI）：提供丰富的人工智能服务和解决方案。产品介绍链接