在網頁設計中，下劃線是一個常見的視覺元素，用于表示文字的重點或鏈接。但是在實際應用中，常常希望在鼠標滑過文字時展現下劃線，這時我們就可以使用CSS來實現。

首先，在HTML中需要添加一個包裝文字的標簽，比如使用一個p標簽：

<p>這是一段需要添加下劃線的文字</p>

然后，我們可以通過CSS來添加樣式：

p {
position: relative;
display: inline-block;
color: #333;
font-size: 16px;
padding: 10px;
}
p::before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
border-bottom: 2px solid #333;
transform: scaleX(0);
transition: transform 0.2s ease;
}
p:hover::before {
transform: scaleX(1);
}

解釋一下代碼：

• 為了讓下劃線只展示在文字下面，我們需要將文字包裝在一個inline-block元素中，這里使用了p標簽；
• 為了讓下劃線緊貼文字，我們使用了position: relative，并添加了一些內邊距來調整樣式；
• 為了創建下劃線，我們使用了::before偽元素來創建一個絕對定位的元素；
• 為了讓下劃線默認不顯示，我們將transform屬性設置為scaleX(0)；
• 為了讓下劃線在鼠標滑過時顯示，我們使用了:hover偽類，并將transform屬性設置為scaleX(1)。

這樣，當鼠標滑過文字時，就會展現下劃線了。如果需要修改下劃線的顏色、寬度等樣式，只需要修改對應的CSS即可。