保持子div的纵横比，同时更改父div的高度和宽度

，可以通过使用CSS的padding-top属性和相对定位来实现。

首先，我们需要设置父div的宽度和高度，可以使用百分比或具体数值来设置。然后，将父div的position属性设置为相对定位，这样子div的定位将以父div为参考。

接下来，我们可以使用padding-top属性来设置子div的高度。padding-top的值可以通过计算子div的纵横比得出，公式为：(高度/宽度) * 100%。这样设置后，子div的高度将根据父div的宽度自动调整，保持纵横比不变。

以下是一个示例代码：

HTML代码：

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

CSS代码：

.parent {
  width: 300px; /* 设置父div的宽度 */
  height: 0; /* 设置父div的高度为0，子div的高度通过padding-top来控制 */
  position: relative; /* 设置父div为相对定位 */
}

.child {
  padding-top: 75%; /* 设置子div的高度，保持纵横比为4:3 */
  background-color: #ccc; /* 设置子div的背景颜色 */
}

在上述示例中，父div的宽度为300px，子div的高度通过padding-top属性设置为75%。这样无论父div的宽度如何改变，子div的高度都会自动调整，保持纵横比为4:3。

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