实现高度自动的过渡

使用`scale`

css

.detail {
  transition: 0.5s;
  transform: scaleY(0);
}
.parent:hover .detail {
  transform: scaleY(1);
}

使用网格布局

有兼容问题

css

.detail {
  transition: 0.5s;
  display: grid;
  grid-template-rows: 0fr;
}
.parent:hover .detail {
  grid-template-rows: 1fr;
}