发新话题
打印

css实现下划线与文字不同颜色

本帖已经被作者加入个人空间

css实现下划线与文字不同颜色

通过CSS的设计,可以达到下划线和文字的颜色不一样的哦,这个主要用在链接文字上。
实现的方法有3种。一种是通过样式的嵌套,一种是通过下边框假冒下划线,最后一种就是用背景图片了。
第一种:
复制内容到剪贴板
代码:
注意<a href=http://blog.imoso.net ><font class=icool >实现下划线与文字不同颜色</font></a>的书写格式!!
明显,这种方法比较麻烦。

第二种是通过下边框假冒下划线:
复制内容到剪贴板
代码:
这个方法实在是太妙了。但是也有一点点缺陷:但文字为英文或数字时,这个假冒的下划线明显离文字太远了(可能很多非中文的可能会出现这个问题)

第三种就是用背景图片啦,这个可以做到很多变化,因为我们可以用上各种线条图片。缺点就是当链接多了,在读取图片的时候可能会比较消耗资源,慢一些。:
复制内容到剪贴板
代码:
换个头像,看见广告就眼红,直接封ID。

TOP

发新话题