我正在嘗試為我的導(dǎo)航欄鏈接制作懸停效果，其中當(dāng)它們懸停時(shí)，邊框底線會(huì)以動(dòng)畫方式進(jìn)入。我嘗試使用此：li:hover a {box-sizing: border-box;width: 100%;border: solid #F5F5F5 5px;padding: 5px;border-top: 0px;border-left: 0px;border-right: 0px;}這部分有效，懸停時(shí)會(huì)出現(xiàn)底線（顯然沒有動(dòng)畫，因?yàn)槲疫€沒有執(zhí)行該部分）。問(wèn)題是，當(dāng)它們懸停時(shí)，不僅會(huì)出現(xiàn)底部邊框，而且所有選項(xiàng)也會(huì)移動(dòng)，就像邊框底部導(dǎo)致整個(gè)導(dǎo)航欄向相反方向稍微移動(dòng)每個(gè)鏈接一樣，就像它們?cè)噲D彼此保持距離。我該如何解決這個(gè)問(wèn)題？我將保留導(dǎo)航欄的 HTML 代碼和一些 css 代碼：HTML：    <ul class="nav-links">    <li><a href="">HOME</a></a></li>    <li><a href="">PORTFOLIO</a></a></li>    <li><a href="">SUBMIT</a></a></li>    <li><a href="">CONTACT</a></a></li>    <li><a href="">ABOUT</a></a></li>    </ul>CSS：* {margin: 0px;padding: 0px;box-sizing: border-box;}body {background-color: #900c3f;}img {width: 130px;margin-top: 20px;margin-left: 20px;margin-bottom: 20px;}nav {display: flex;justify-content: space-around;align-items: center;min-height: 8vh;background-color: #ff5733;}li:hover a {box-sizing: border-box;width: 100%;border: solid #F5F5F5 5px;padding: 5px;border-top: 0px;border-left: 0px;border-right: 0px;}.nav-links {display: flex;justify-content: space-around;width: 80%;}.nav-links li {list-style: none;}.nav-links a {text-decoration: none;font-family: Poppins;color: #F5F5F5;letter-spacing: 3px;font-weight: bold;font-size: 130%;}是否有任何 div 應(yīng)該添加到導(dǎo)航欄？或者我所做的一切毫無(wú)意義？我仍在學(xué)習(xí)，所以我可能會(huì)搞砸。這是一個(gè)屏幕截圖，以防萬(wàn)一：懸停導(dǎo)航欄的屏幕截圖感謝社區(qū)！