鼠标悬停图片显示文字

要实现鼠标悬停图片显示文字，可以使用HTML和CSS。具体步骤如下：

1. 首先，在HTML中创建一个包含图像和字幕的元素，可以使用<div>元素来包含它们。

<div class="image-container">
  <img src="your-image.jpg" alt="Your Image">
  <div class="caption">这里是字幕</div>
</div>

2. 接下来，在CSS中设置图像和字幕的样式，并将字幕的初始状态设置为隐藏。

.image-container {
  position: relative;
  display: inline-block;
}

.caption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-size: 18px;
  padding: 10px;
  text-align: center;
  opacity: 0;
  transition: opacity 0.5s;
}

.image-container:hover .caption {
  opacity: 1;
}

3. 最后，将HTML和CSS保存为一个HTML文件，并在浏览器中打开该文件，当鼠标悬停在图像上时，字幕会显示出来。