如何去掉链接的下划线
解决思路:
控制链接下划线的CSS属性是text-decoration,各参数说明如下:
none 无修饰
blink 闪烁
underline 下划线
overline 上划线
line-through 删除线
显而易见,要去掉链接的下划的话只须把text-decoration的值设为none。 具体步骤:
代码示例:
<pre>
<a href="http://www.flash8.net">闪吧</a> <a href="http://www.flash8.net" style="text-decoration:none">闪吧</a>
</pre>
注意: text-decoration的值设为blink时在IE中不会有闪烁效果,效果同none。
技巧:除none外,其余的值可以混用,各值间空格隔开,如:
<a href="http://www.flash8.net"
style="text-decoration:underline overline line-through">闪吧</a>
或
<style>
a{text-decoration:underline overline line-through}
</style>
<a href="http://www.flash8.net">闪吧</a>
提示:要了解链接的各状态定义,请参考本部分第三章。
试一试:把一个页面中所有链接的下划线去掉。
特别提示
本例的代码运行效果如图2.1.1.5所示,左边的链接为默认时的效果,右边为用CSS定义去掉下划线的效果。
图2.1.1.5 去掉链接的下划线
特别说明
text-decoration属性可以设置元素中的文本的修饰效果,对应的脚本特性为textDecoration。该属性不仅仅适用于链接元素A,对其他元素定义该属性也一样生效,并且对于部分元素,默认值就有文本的修饰效果,如:
元素A(带href属性)、U和INS的默认修饰效果为下划线underline。
元素STRIKE、S和DEL的默认修饰效果为贯穿线line-through。