我有三张图片，在悬停时它们使用 :hover 在 css 中增加大小.当用户将鼠标悬停在图像上时，我还希望出现一个带有图像描述的工具提示(我也应该能够定位工具提示).

HTML

<div class="bottle-container"><div class="click-to-top"><img src="image-1.png" alt="Image 1"/>工具提示文本</div><div class="click-to-top" style="z-index:5;"><img src="image-2.png" alt="Image 2"/></div><div class="click-to-top last"><img src="image-3.png" alt="Image 3"/></div></div>

CSS

容器{最大宽度:600px；边距:0 自动；最小高度:450px；}div.click-to-top {显示:内联块；位置:相对；最大宽度:160px；}div.click-to-top:悬停{z指数:10；}div.click-to-top img{-webkit-transition:全0.8s；moz-transition:全部为 0.8s；过渡:全0.8s；宽度:130px；}div.click-to-top img:hover{宽度:140px；z指数:10；}

您可以将文本包装到