在懸停的鏈接下創建下劃線

Question

我正在尋找一種方法，讓一個鏈接下方的下劃線在懸停時進行拍攝，並在鼠標懸停時再次離開。我不確定我是否做得很好解釋，所以如果你不明白，請告訴我。我很確定這不能用一個實際的下劃線來完成，可能是使用<hr>標籤？任何幫助表示讚賞！

Answer 1

a { 
    text-decoration: none; 
    display: inline-block; 
    border-bottom: 1px solid blue;  
    margin-right: 39px; 
    width: 0px; 
    -webkit-transition: 0.5s ease; 
      transition: 0.5s ease; 
} 

a:hover { 
    -webkit-transition: 0.5s ease; 
      transition: 0.5s ease; 
    border-bottom: 1px solid blue; 
    width: 30px; 
    margin-right: 9px; 
} 

從這裏摘自：Underline css3 transition

Answer 2

這是非常簡單的CSS：

a { 
    text-decoration: none; 
} 

a:hover { 
    text-decoration: underline; 
} 

但是，這僅僅是一個懸停效果，如果你想有一個過渡，然後上面的回答應該工作。