在悬停时在链接下进行下划线拍摄

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;
}

但这仅仅是为了悬停效果，如果你想要转换，那么上面的答案应该有效。