如何在包含滚动条的父div中将子div垂直居中？

.parent-div {
  height: 300px; /* 设置父div的固定高度 */
  position: relative; /* 设置相对定位 */
  overflow-y: scroll; /* 添加滚动条 */
}

.child-div {
  position: absolute; /* 设置绝对定位 */
  top: 50%; /* 将子div的顶部定位到父div的中间位置 */
  transform: translateY(-50%); /* 使用负的margin-top将子div向上移动自身高度的一半 */
}

.child-div {
  max-height: 100%; /* 设置子div的最大高度为父div的高度 */
}