[分享]css中如何显示没有下划线的超链接

CSS中的超链接默认会有下划线，但是在某些设计需求中，我们希望去掉下划线。那么该怎么做呢？a { textdecoration: none; } 上面的代码就是将超链接的下划线去掉了。但是去掉下划线后...

CSS中的超链接默认会有下划线，但是在某些设计需求中，我们希望去掉下划线。那么该怎么做呢？

a {
  text-decoration: none;
} 

上面的代码就是将超链接的下划线去掉了。但是去掉下划线后，用户将难以分辨哪些是超链接，所以建议对鼠标悬停时的状态做特别处理，以便提醒用户点击超链接。

a:hover {
  text-decoration: underline;
} 

这里的代码是将鼠标移动到超链接上时，加上下划线。这样用户就能够更容易地识别超链接了。

除了下划线，超链接的样式还可以通过text-decoration属性设置，如dotted（虚线）、dashed（短横线）、solid（实线）等。

a {
  text-decoration: dotted;
} 

上述代码将超链接的样式改为虚线。当然，作为一个程序员，不仅能达到原始设计的要求而已，还需要看看有没有更好的设计方案。