CSS鼠標經過出現內容是一種常見的交互設計效果，可以讓用戶更加直觀地感受頁面的變化。下面我們來看一下CSS如何實現鼠標經過出現內容效果。

/* HTML代碼 */
<div class="content">
<p>這里是默認內容</p>
<div class="hover">這里是鼠標經過后出現的內容</div>
</div>
/* CSS代碼 */
.content .hover {
display: none;/*默認隱藏*/
}
.content:hover .hover {
display: block;/*鼠標經過顯示*/
}

上述代碼中，我們使用了CSS偽類選擇器:hover，表示當鼠標懸浮在.content元素上時觸發樣式。同時，我們為.hover元素設置了display:none樣式，表示默認隱藏該元素。

當用戶鼠標懸浮在.content元素上時，我們將.hover元素的display屬性設置為block，此時.hover元素便會顯示在頁面上。如果用戶移開鼠標，則.hover元素又會隱藏。

需要注意的是，該效果只在CSS3及以上版本中才能實現。如果需要兼容低版本瀏覽器，可以使用JavaScript等其他技術手段實現。