让子元素的高不跟随父元素

如果你希望子元素的高度不受父元素的影响，可以尝试以下几种方法：

1. 绝对定位

可以将子元素设置为绝对定位，并将其`top`和`left`属性设置为`0`，来让子元素相对于父元素定位。然后，再将子元素的`height`属性设置为`100%`，即可让子元素的高度占据整个父元素。

.parent {
  position: relative;
}

.child {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}

2. 使用 Flex 布局

可以使用 Flex 布局来让子元素的高度不受父元素的影响。将父元素的`display`属性设置为`flex`，并将其`flex-direction`属性设置为`column`，即可让子元素垂直排列。然后，再将子元素的`flex-grow`属性设置为`1`，即可让子元素的高度占据剩余空间。

.parent {
  display: flex;
  flex-direction: column;
}

.child {
  flex-grow: 1;
}

3. 使用 Grid 布局

类似地，也可以使用 Grid 布局来让子元素的高度不受父元素的影响。将父元素的`display`属性设置为`grid`，并将其`grid-template-rows`属性设置为`auto 1fr`，即可让第一行自适应子元素的高度，第二行占据剩余空间。

.parent {
  display: grid;
  grid-template-rows: auto 1fr;
}

以上是几种常见的解决方法，具体使用哪种方法取决于你的需求和布局结构。