CSS可以通過:hover偽類實現鼠標經過提示內容的效果。

.tip {
position: relative;
display: inline-block;
}
.tip:hover::before {
content: attr(data-tip);
position: absolute;
left: -50%;
bottom: 100%;
padding: 0.5rem;
font-size: 1rem;
color: #fff;
background-color: #000;
border-radius: 0.25rem;
}

上面代碼中，首先為提示內容的外層容器設置了position: relative屬性，以便后續通過position: absolute屬性確定提示框的位置。同時，為了保證外層容器能夠正常顯示內容，display屬性也被設置成inline-block。

接下來，利用:hover偽類選擇器，為外層容器設置鼠標經過的樣式。這里用到了::before偽元素，使用content屬性設置了提示內容。通過position屬性控制提示框的位置，left和bottom值分別為外層容器左側和底部的50%。padding屬性為內邊距，font-size屬性設置字體大小，color屬性設置字體顏色，background-color屬性設置背景顏色，border-radius屬性設置邊框圓角。

最后，在外層容器上設置data-tip屬性，以便通過attr()函數獲取提示內容。例如：

<div class="tip" data-tip="這里是提示內容">鼠標經過顯示提示</div>

上述代碼中，外層容器的data-tip屬性的值為"這里是提示內容"，當鼠標經過容器時，CSS會通過attr()函數獲取該屬性值并在對應位置顯示提示框。