用CSS控制文本链接的下划线距离

本来公司网站的链接文本的下划线都被我取消了，但领导说要不够醒目要向新浪学习。

但在我在CSS中新加了TEXT-DECORATION: underline; 后发现下划线离文本太近了，很难看。

在分析新浪CSS代码和在百度上查找资料后，发现有两个方法可以让我自定义下划线的距离。第一种方法就是：给每个链接添加下划线的背景图片；第二种就是：让自定义边框属性中只显示底边。

代码一：

a {
    text-decoration: none;
    background: url(underline.gif) repeat-x 100% 100%;
    padding-bottom: 4px;
    white-space: nowrap;
}

代码二：

A {
TEXT-DECORATION: none;
padding:0 0 6 0;
border-bottom-color:0;
border-bottom-width:1px;  
border-bottom-style:solid;  
}

第一种方法可以自定义各种花纹样式的下划线，第二章方法只是让下划线离文本稍微远一点。