如何与响应式div垂直对齐(无高/宽)？

要实现与响应式div垂直对齐（无高/宽），可以使用CSS的Flexbox布局或Grid布局来实现。以下是两种方法的详细说明：

1. 使用Flexbox布局： Flexbox是一种弹性盒子布局模型，可以轻松实现垂直对齐。以下是实现垂直对齐的步骤：

步骤1：在父容器上应用Flexbox布局。

.container {
  display: flex;
  align-items: center; /* 垂直居中对齐 */
}

步骤2：在子元素上设置flex属性。

.child {
  flex: 1; /* 子元素自动填充剩余空间 */
}

这样，子元素将垂直居中对齐。

1. 使用Grid布局： Grid布局是一种二维网格布局模型，也可以实现垂直对齐。以下是实现垂直对齐的步骤：

步骤1：在父容器上应用Grid布局。

.container {
  display: grid;
  align-items: center; /* 垂直居中对齐 */
}

步骤2：在子元素上设置grid属性。

.child {
  grid-area: 1 / 1 / 2 / 2; /* 子元素占据第一行第一列 */
}

这样，子元素将垂直居中对齐。

以上是使用CSS的Flexbox布局和Grid布局实现与响应式div垂直对齐的方法。这两种方法都能够适应不同屏幕尺寸和设备类型，实现响应式的布局。