两个盒子竖向排列一个向上放大另一个在原位不变化怎么实现

要在网页设计或CSS布局中实现这样的效果，可以利用CSS的`display`, `flexbox`, 和 `transform` 属性。假设这两个盒子分别是 `.box1` 和 `.box2`：

1. 首先，将容器设置为 flex 盒子模式，这样可以轻松控制元素的对齐和尺寸：

.container {
  display: flex;
  justify-content: center; /* 保持居中对齐 */
}

2. 对于`.box1`，使其垂直居中并调整大小：

.box1 {
  width: 50%;
  height: initial; /* 或者设置一个具体的值，如200px */
  transform: scale(1.5); /* 放大1.5倍 */
  transition: all 0.3s ease; /* 添加过渡效果，使放大平滑 */
}

.box1:hover {
  transform: scale(1);
}

当鼠标悬停在`.box1`上时，它会恢复到原始大小。

3. 对于`.box2`，保持不变：

.box2 {
  width: 50%; /* 如果需要的话，可以设置其他宽度 */
  height: 100%; /* 或者设置一个具体的值，保证高度始终等于其内容的高度 */
  position: relative; /* 这有助于在悬浮`.box1`时不移动位置 */
}

这样，`.box1`放大展示在上方，`.box2`则保持原始大小不变。如果你需要兼容旧版浏览器，记得添加相应的前缀（如 `-webkit-` 或 `-moz-` 等）。