关于链接下划线不齐的解决方法

 想必有些朋友跟我一样,也常会遇到在页面显示上有些链接的下划线是不齐的情况,而且好像好多网站上,甚至是一些公司的Web产品中也是这样,这种情况主要是一些发生在链接中即有中文又有英文字符的情况下,一般是英文字符的下划线会偏高一些,这样整体看起来非常难看。

要解决这个问题其实很简单只需要在你的链接样式中加上一句：

a  {...} { font-family: 微软雅黑,宋体; }

想必大家也猜出来了吧，其实造成这种问题的根本是英文字符的字高与中文字符的字高不一致导致的，那说到底原因主要是因为大多数朋友会在css 中整体上设置字体的类型：

* {...} { font-family:Arail, 微软雅黑,宋体;}

这样的话：英文字符会首选英文字体，那么它的高度就会与中文字符不同，那么问题也就出现了。

另一种解决办法是将链接的下划线设置为none,另外再设置它的border-bottom即可:

a {...} {  text-decoration:none; border-bottom:solid 1px #ccc;}

 

好了，很简单，希望能对遇到此类问题的朋友有一些帮助。