CSS鼠標經過看圖片是網站設計中常用的一個效果，可以讓網頁更加生動和互動。這里是一個示例：

<style>
.img-container{
position: relative;
display: inline-block;
}
img{
width: 100%;
height: auto;
}
.img-overlay{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: none;
background-color: rgba(0, 0, 0, 0.5);
text-align: center;
color: #fff;
}
.img-container:hover .img-overlay{
display: block;
}
</style>
<div class="img-container">
<img src="image.jpg">
<div class="img-overlay">
<p>圖片標題</p>
<p>圖片描述</p>
</div>
</div>

上述代碼中，我們首先定義了一個類為img-container的元素，使用position屬性進行定位，同時設置為inline-block，以便能夠和其他元素一行排列。對于img元素，我們設置了寬度為100%（即與父元素相同），高度自適應。接下來，我們定義類為img-overlay的元素，這個元素使用position:absolute進行絕對定位，并使用display:none將其隱藏。對于鼠標經過事件，我們通過:hover pseudoclass實現了顯示img-overlay元素的效果。

在這個例子中，我們為img-overlay添加了標題和描述內容。當鼠標經過該元素時，這些內容將被顯示在圖片上方的黑色半透明背景中。這樣，我們就可以讓圖片獲得更多的信息和視覺效果。