在能为链接创建自定义下划线之前，我们需要移除已经存在的下划线：
a { text-decoration: none; }
-------------------------------------------------
[补充]
语法：
text-decoration : none || underline || blink || overline || line-through
取值：
none : 默认值。无装饰
blink : 闪烁
underline : 下划线
line-through : 贯穿线
overline : 上划线
说明：
检索或设置对象中的文本的装饰。
有 href 特性的 a ，以及 u ， ins 对象默认值为 underline 。
对象 strike ， s ， del ，默认值是 line-through 。
假如 none 值在属性声明的最后，所有的先前的其他取值都会被清除。例如，声明 text-decoration: underline overline blink none 等于声明 text-decoration: none 。
假如对象没有文本(如 img 元素)或者是空元素(如：<EM></EM>)， 此属性不会发生作用。
假如你设置 body 对象的此属性值为 none ， a 对象将依然保持其原有的下划线样式。除非你针对 a 对象声明此属性值。
指定块对象的此属性将影响其所有内联子对象。而此影响一旦发生，块对象容器最终会受到影响。
在IE4+中可用的值为 overline 和 blink 。虽然 blink 值被提供，但它不会被作用。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 textDecoration 。
-------------------------------------------------
为了创建自定义的下划线，我们为链接元素设置背景图像：
a { background-image: url(underline.gif); }
-------------------------------------------------
[补充]
语法：
background-image : none | url ( url )
取值：
none : 默认值。无背景图
url ( url ) : 使用绝对或相对 url 地址指定背景图像
说明：
设置或检索对象的背景图像。
当背景图像与背景颜色( background-color )都被设定了时，背景图片将覆盖于背景颜色之上。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 backgroundImage 。
-------------------------------------------------
我们希望这个图像在文本底部顺着水平方向重复而不是垂直方向，否则它就将显示在链接文本自身的后面。我们限制背景图像沿着X轴重复：
a { background-repeat: repeat-x; }
-------------------------------------------------
[补充]
语法：
background-repeat : repeat | no-repeat | repeat-x | repeat-y
取值：
repeat : 默认值。背景图像在纵向和横向上平铺
no-repeat : 背景图像不平铺
repeat-x : 背景图像仅在横向上平铺
repeat-y : 背景图像仅在纵向上平铺
说明：
设置或检索对象的背景图像是否及如何铺排。必须先指定对象的背景图像( background-image )。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 backgroundRepeat 。
-------------------------------------------------
更多的利用CSS，链接下划线也玩自定义请到论坛查看: http://BBS.TC711.COM
【 双击滚屏 】 【 评论 】 【 收藏 】 【 打印 】 【 关闭 】
来源：
互联网
日期：2007-8-31
