我想要我的鼠标悬浮在图片上时，它可以增大zindex，鼠标不悬浮时不变回去

要实现在鼠标悬停时图片的`z-index`增加，鼠标离开后恢复原状的效果，你可以结合CSS和HTML使用`:hover`伪类。这是一个简单的CSS示例：

.floating-image {
    position: relative;
    z-index: 0; /* 初始的z-index */
}

.floating-image:hover {
    z-index: 99; /* 当鼠标悬浮时的较高z-index值 */
}

这里，`.floating-image`是你的图片元素的选择器，`z-index: 0`设定了默认的层级，当鼠标移动到图片上时，`:hover`伪类生效，`z-index: 99`使得图片浮于其它元素之上。

如果你需要在无JS的情况下实现这个功能，纯CSS无法监听鼠标离开事件，所以你需要依赖HTML5的`data-*`属性或者第三方库（如jQuery）。以下是一个使用`data-z-index`的例子：

<img src="your-image.jpg" alt="Your Image" data-z-index="0" class="floating-image">

然后在CSS中：

.floating-image {
    position: relative;
    transition: z-index 0.3s; /* 添加过渡效果，平滑地切换z-index值 */
}

.floating-image:hover {
    z-index: var(--hover-zindex, 99); /* 使用变量，方便以后更改 */
}

/* 使用JavaScript获取数据，动态设置hover状态下的z-index */
<script>
    const images = document.querySelectorAll('.floating-image');
    images.forEach(img => img.addEventListener('mouseover', () => {
        img.dataset.zIndex = '99';
    }));
    
    images.forEach(img => img.addEventListener('mouseout', () => {
        img.dataset.zIndex = '0';
        img.style.zIndex = img.dataset.zIndex;
    }));
</script>

这段脚本会在鼠标进入和离开图片时改变`data-z-index`，并将此值应用回`z-index`。注意，为了优雅地处理动画，我们添加了一个CSS过渡效果。