svg 立体视差滑动效果

可以通过使用CSS3的transform属性和perspective属性来实现SVG立体视差滑动效果。具体实现方法可以参考以下代码：

HTML代码：

<svg viewBox="0 0 500 500">
  <rect x="50" y="50" width="100" height="100" fill="#f00" />
  <rect x="200" y="50" width="100" height="100" fill="#0f0" />
  <rect x="350" y="50" width="100" height="100" fill="#00f" />
</svg>

CSS代码：

svg {
  width: 500px;
  height: 500px;
  perspective: 1000px;
}

rect {
  transition: transform 0.5s ease;
}

rect:hover {
  transform: translateZ(50px);
}

这段代码中，我们首先给SVG元素设置了perspective属性，这个属性可以让SVG元素具有透视效果。然后我们给每个矩形元素设置了transition属性，这个属性可以让矩形元素在发生变化时有一个平滑的过渡效果。最后，我们给每个矩形元素设置了:hover伪类，当鼠标悬停在矩形元素上时，会触发transform属性，让矩形元素在Z轴方向上移动50px，从而实现立体视差滑动效果。

注意：这段代码只是一个示例，实际应用中需要根据具体情况进行调整。