css触碰图片方法，同时在图片上方弹出信息

您可以使用CSS的:hover选择器来实现触碰图片时弹出信息的效果。具体步骤如下：

1.在HTML中插入图片和信息框的代码

<div class="image-container">
  <img src="your-image-src" alt="your-image-alt">
  <div class="info-box">
    <p>your info text</p>
  </div>
</div>

2.使用CSS设置图片和信息框的样式

.image-container {
  position: relative;
}

.info-box {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #fff;
  padding: 10px;
  display: none;
}

.image-container:hover .info-box {
  display: block;
}

解释：

- 将图片和信息框都包裹在一个div容器中，并设置该容器为相对定位。
- 设置信息框为绝对定位，并将其置于容器的顶部左侧。同时设置信息框的背景色和内边距，并将其初始状态设置为不显示。
- 使用:hover选择器，当鼠标悬停在容器上时，显示信息框。

这样，当用户将鼠标悬停在图片上时，信息框就会弹出并显示相应的信息。您可以根据需要调整样式和布局。