文章标签

Nicky Meuleman，受 Cassie Evans 启发，详细介绍了他们如何在网站上构建锚链接悬停效果。当鼠标悬停在链接上时，另一个颜色的下划线会以两端留有间隙的方式滑入。传统的 text-decoration 在这里无济于事，...

Chip Cullen:

假设您正在构建一个网站，并且与设计师合作。他们为您提供了一些扎实的設計，您已经准备好开始工作。您也是一名尽职尽责的前端开发人员，并且喜欢制作...

这是一个很酷的小效果。默认的链接样式带有下划线（这是一个好主意），然后在 :hover 状态下，您会看到下划线实际上变粗了，几乎变成了您在...时所期望的样子...

在我们讨论如何为下划线添加样式之前，我们应该回答一个问题：我们应该使用下划线吗？

在平面设计中，下划线通常被认为是不够精致的。还有更巧妙的方式来突出重点、建立层级结构和区分标题...。

为链接下方显示的下划线添加样式可能是一件棘手的事情，我总是忘记在不同情况下哪个方法最好。不过，谢天谢地，John Jameson 在这篇客座文章中为我们详细介绍了相关内容。…

您可能非常了解经典的链接样式。蓝色带下划线。有一种更巧妙的方法可以实现相同的效果。

以下是代码

a {
  text-decoration: none;
  background: url(link-line.gif) repeat-x 0