在web開發中，我們通常需要在圖片上顯示一些關鍵信息。這時，懸停圖片顯示文字就成為了一種非常實用的技巧。通過CSS，我們可以很容易地實現這個效果。

img:hover::before {
content: "這是圖片的說明文字";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 10px;
background-color: rgba(0, 0, 0, 0.6);
color: #fff;
font-size: 20px;
}

以上是實現懸停圖片顯示文字的CSS代碼。其中，:hover選擇器表示當鼠標懸停在圖片上時觸發此效果。::before偽元素表示在圖片之前插入一個文字塊。

在具體的CSS屬性中，position: absolute表示該文字塊的位置為絕對定位，bottom: 0和left: 0表示該文字塊的位置在圖片的左下角，width: 100%表示該文字塊的寬度與圖片的寬度相等，padding: 10px表示該文字塊內部的padding為10個像素，background-color: rgba(0, 0, 0, 0.6)表示該文字塊的背景色為半透明的黑色，color: #fff表示該文字塊的文字顏色為白色，font-size: 20px表示該文字塊的字體大小為20像素。

通過以上CSS代碼，我們可以實現在圖片上懸停顯示文字的效果。這種技巧非常實用，可以幫助我們在展示圖片的同時，更加準確地傳達信息。