CSS 实现中心店放大缩小效果：鼠标悬停动画

.center {
  position: relative;
  width: 300px;
  height: 300px;
  background-color: #eee;
}

.item {
  position: absolute;
  width: 50px;
  height: 50px;
  background-color: #ccc;
  transition: transform 0.2s ease-in-out;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.center:hover .item {
  transform: scale(1.5);
}

本示例中，center 类为中心店元素，item 类为子元素。通过 transform: translate(-50%, -50%) 将子元素居中，并使用 transform: scale(1.5) 在鼠标悬停时放大子元素。transition 属性则为缩放效果添加了过渡动画。

使用该方法可以轻松实现中心店放大缩小效果，并为用户提供更生动的视觉体验。