CSS设置当鼠标放上去的时候变成另一张图片

可以使用CSS的:hover伪类以及background-image属性来实现鼠标放上去时图片切换的效果。具体的CSS代码如下：

div {
  width: 200px;
  height: 200px;
  background-image: url("image1.jpg");
  background-size: cover;
  transition: background-image 0.5s ease;
}

div:hover {
  background-image: url("image2.jpg");
}

上述代码中，首先设置一个div元素，并将其背景图片设置为image1.jpg，当鼠标放上去时将背景图片切换为image2.jpg。这里使用了transition属性来实现平滑的过渡效果，使图片切换更加自然。注意，要将两张图片都放在与HTML文件相同的目录下，同时在CSS中正确设置图片的路径。

相关问题

CSS设置图片鼠标放上去时变红色

可以使用CSS的:hover伪类来实现鼠标放上去时图片变红色的效果。具体的CSS代码如下：

img:hover {
  filter: grayscale(100%) brightness(150%) saturate(150%);
}

上述代码中，filter属性用于设置图像的滤镜效果，grayscale(100%)用于将图像变为灰色，brightness(150%)用于增加图像的亮度，saturate(150%)用于增加图像的饱和度。这些效果的组合可以使图像变为红色。

设置带A标签的图片当鼠标放上去的时候变红色

可以使用CSS的:hover伪类来实现鼠标放上去时带A标签的图片变红色的效果。具体的CSS代码如下：

a:hover img {
  filter: grayscale(100%) brightness(150%) saturate(150%);
}

上述代码中，通过选择器"a:hover img"选中了鼠标放在A链接上时的图片元素，然后使用filter属性设置图像的滤镜效果，和上面一样，使图像变为红色。