鏈接下劃線是網(wǎng)頁設(shè)計(jì)中一個(gè)經(jīng)典的元素，用來增強(qiáng)鏈接的可識(shí)別性和可點(diǎn)擊性。下面是一個(gè)使用CSS來添加鏈接下劃線的代碼示例： ```html

這是一個(gè)有下劃線的鏈接：點(diǎn)擊這里

``` ```css a { text-decoration: none; /* 去掉默認(rèn)下劃線 */ position: relative; /* 相對(duì)定位 */ } a::after { content: ""; position: absolute; /* 絕對(duì)定位在鏈接下方 */ width: 100%; transform: scaleX(0); /* 初始寬度為0 */ height: 1px; /* 下劃線的高度 */ bottom: 0; /* 定位到鏈接下方 */ left: 0; /* 對(duì)齊到左邊 */ background-color: #000; /* 下劃線顏色 */ transition: transform 0.2s ease-in-out; /* 動(dòng)畫效果 */ } a:hover::after { transform: scaleX(1); /* 鼠標(biāo)放到鏈接上時(shí)，下劃線慢慢變寬 */ } ``` 在以上代碼中，我們首先去掉了鏈接的默認(rèn)下劃線，然后通過a::after選擇器，添加了一個(gè)絕對(duì)定位的偽元素，用來模擬鏈接下方的下劃線。下劃線的寬度最初為0，通過:hover偽類，當(dāng)鼠標(biāo)放在鏈接上時(shí)逐漸變寬，形成動(dòng)畫效果。 以上代碼可以放在style標(biāo)簽中，或者單獨(dú)放在一個(gè)CSS文件中，在網(wǎng)頁中引入即可。通過這種方法，我們可以為網(wǎng)頁中的鏈接增加下劃線，使其更加突顯，提高用戶體驗(yàn)。