如何从链接中删除下划线并在悬停时添加下划线？ （附图）

Question

我想从链接中删除下划线。另外，当我用鼠标指针悬停它时，我想要显示下划线。如何才能做到这一点？请帮忙。

没有悬停：

当我悬停Login链接时：

Answer 1

您需要关闭链接的CSS属性text-decoration，然后在悬停时使用:hover dynamic pseudo class添加text-decoration。

a {
    text-decoration:none;
}

a:hover {
   text-decoration:underline;
}

Demo

此外，您可能还需要设置:visited:hover伪类的样式，以便在用户已访问过的链接上显示下划线。 link order in css是一个很好的答案，因为CSS规则的 order 很重要。

Answer 2

假设您的登录链接的ID为login ...

#login {
   text-decoration: none;
}

#login:hover {
   text-decoration: underline;
}

Answer 3

在你的样式表中，无论身份证是什么。

#LoginButton a:active {text-decoration: none;}
#LoginButton a:hover {text-decoration: underline; color: white;}

Answer 4

在登录按钮中调用CSSClass并在样式表中定义以下行

   .ClassName a:link {text-decoration:none;}//removes underline


   .ClassName a:hover {text-decoration:underline;}// displays underline on mouse over

希望这会有所帮助..