css 子元素跟随父元素高度

可以使用CSS的position和top、bottom属性来实现子元素跟随父元素高度的效果。具体方法如下：

1. 父元素设置position: relative

2. 子元素设置position: absolute

3. 子元素设置top: 0; bottom: 0;

这样就可以让子元素随着父元素的高度自适应了。示例代码如下：

<div class="parent">
  <div class="child"></div>
</div>

.parent {
  position: relative;
  height: 300px;
}

.child {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  background-color: #ccc;
}

以上代码中，父元素设置了一个固定高度，子元素通过设置top: 0; bottom: 0;来跟随父元素的高度自适应。

相关问题

css子元素长宽跟随父元素

在CSS中，可以通过设置父元素的`overflow`属性来实现子元素的长宽跟随父元素。具体有以下几种方式：

1. `overflow: overlay;`：当子元素超出父元素内容时，父元素会被子元素超出部分撑大至子元素同样大小。这样可以实现子元素的长宽跟随父元素。例如：

.parent {
  width: 200px;
  height: 200px;
  overflow: overlay;
}

.child {
  width: 100%;
  height: 100%;
}

2. `overflow: scroll;`：当子元素超出父元素内容时，父元素会显示滚动条，通过滚动条可以查看子元素的内容。这样也可以实现子元素的长宽跟随父元素。例如：

.parent {
  width: 200px;
  height: 200px;
  overflow: scroll;
}

.child {
  width: 100%;
  height: 100%;
}

3. `overflow: auto;`：当子元素超出父元素内容时，父元素会根据需要自动显示滚动条。这样同样可以实现子元素的长宽跟随父元素。例如：

.parent {
  width: 200px;
  height: 200px;
  overflow: auto;
}

.child {
  width: 100%;
  height: 100%;
}

需要注意的是，以上方法只是实现子元素的长宽跟随父元素，但并不会改变父元素的实际大小。父元素的宽高仍然是原来设置的值，只是在视觉上被撑大成了子元素同样的尺寸。

CSS子元素选择父元素

很抱歉，我的回答还是有误。CSS中的子元素选择器确实不能直接选择父元素。如果需要选择某个元素的父元素，可以使用CSS中的“通用兄弟选择器”（~）或“相邻兄弟选择器”（+）以及一些其他选择器来选择父元素。例如，以下CSS规则将选择所有有子元素的div元素的父元素，并设置它们的背景颜色为灰色：

div ~ *:last-child,
div + *:last-child {
  background-color: gray;
}

这将选择所有有子元素的div元素的父元素，而不包括那些没有子元素的div元素的父元素。这里使用了通用兄弟选择器和相邻兄弟选择器来选择每个div元素后面的最后一个子元素。请注意，这种选择器的使用可能会影响性能，因此应该谨慎使用。