自定义网页超链接下划线的CSS代码

2016-02-19 18:28 13 1 收藏

关注图老师设计创意栏目可以让大家能更好的了解电脑,知道有关于电脑的更多有趣教程,今天给大家分享自定义网页超链接下划线的CSS代码教程,希望对大家能有一点小小的帮助。

【 tulaoshi.com - Web开发 】

链接元素的所有CSS属性可以合并为:

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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

如果你想自定义下划线的效果只在鼠标滑过链接时出现,只需设置CSS背景属性为:hover伪类,取代直接设置于链接元素上的样式即可。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

a {
    text-decoration: none;
    padding-bottom: 4px;
    white-space: nowrap;
}

a:hover {
    background: url(underline.gif) repeat-x 100% 100%;
}

来源:http://www.tulaoshi.com/n/20160219/1617832.html

延伸阅读
标签: Web开发
第一种方法:直接在 修改-页面属性 里面修改 第二种方法:鉴于往往在 页面属性 里面修改后,预览后依旧存在下划线,提供相关代码如下: style a:link {text-decoration:none} a:visited {text-decoration:none} /style 放bodybody/中间。
标签: word
word下划线怎么输入   下划线,大家经常接触到的一般用在名字的输入中,(只可以输入数字,字母,下划线)而在一些文档(如WORD)中,下划线常被用作增强注意。而在网页中,可以连接的文字(超链接)下面一般都有下划线。 看到键盘上挨着删除键和加号等号键的那个有两条-的键了吗?那是减号键和横线键,下划线就是同时按住这个键和Shift...
标签: 电脑入门
选中文字,再点击下划线按扭,如果只要下划线,那可以敲几下空格键,选中,按下划线按扭,如果要加长,就在空格的中间位置敲空格键就可以。
标签: Web开发
以下是引用片段: style type="text/css" a{ color:#333333; text-decoration:none;} a:visited {color:#333333; text-decoration:none;} a:hover { color:#FF0000; text-decoration:underline;} a span { color:#333333;} /style a href="#"span111/span/a style type="text/css"a{ color:#333333; text-decor...
标签: 电脑入门
在我们利用Word制作考试卷的时候难免会输入一些下划线 ,如填空题中间会留一点空格下划线,让学生能 够填写答案;如文字下面加下划线,能够更好的突出重点;如波浪下划线、双下划线等各种不同的下划线,这些都是怎么输入的呢?那就要仔细看看本文了,接下来 Word联盟会以Word2003为例给大家一一介绍各式各样的下划线是怎么打的。 空白下划线...

经验教程

236

收藏

68
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部