CSS 可以指定下划线,而本例是通过技巧实现自定义多彩超链接下划线的效果,本效果兼容 IE、Firefox、Opera、Netscape 等浏览器。
原理
利用 CSS 为超链接添加背景作为下划线。
关键
- line-height:150%; 设置适当的行距
- padding-bottom:2px; 留出空白便于显示下划线图片
- text-decoration:none; 取消自带的下划线
- background-image:url("u1.gif"); 用背景图片作为下划线
- background-position:center bottom; 背景水平居中、垂直居下显示
- background-repeat:repeat-x; 背景只在水平方向重复
- white-space:nowrap; 超链接不换行,如果换行则只有最后一排文字有效果
示例
[Ctrl+A 全部选择 提示:您可先修改部分代码,再按运行]
相关阅读