html下划线颜色的修改方法

这篇文章将为大家详细讲解有关html下划线颜色的修改方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

成都创新互联专注于沈河企业网站建设,响应式网站设计,商城建设。沈河网站建设公司,为沈河等地区提供建站服务。全流程按需网站策划,专业设计,全程项目跟踪,成都创新互联专业和态度为您提供的服务

方法:1、给元素设置“text-decoration:underline;color:颜色值”样式即可;2、使用border-bottom属性,只需要给元素设置“border-bottom:大小 样式 颜色”样式即可。

本教程操作环境:windows7系统、html&&HTML5版、Dell G3电脑。

有两个方法

● 第一个就是给标签加上一个text-decoration:underline,属性,设置下划线的颜色需要设置元素的color属性,缺点是文字颜色和下划线颜色是一致的,不能单独控制。

示例:



  
    
    Document
    
  
  
    

      css实践之文字下划线颜色-我的下划线与文字为绿色     

  

效果:

html下划线颜色的修改方法

● 第二个就是给标签加一个底部边框:border-bottom:1px solid red,要想与文字有间距使用padding-bottom属性就可以了!第二种可以单独控制下划线的样式!

在需要改变的文字下划线样式地方,使用css border-bottom下边框样式来变通地实现替代text-decoration下划线样式的效果;通过对文字设置下边框颜色、下边框宽度、下边框虚线或实线等CSS样式控制实现需要各式各样下划线效果。

示例:



  
    
    Document
    
  
  
    

css实践之文字下划线颜色-我的下划线实现为红色

    

css实践之文字下划线颜色-我的下划线实现为蓝色,文字为绿色

    

css实践之文字下划线颜色-我的下划线实现为黑色

  

效果:

html下划线颜色的修改方法

关于“html下划线颜色的修改方法”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。


当前标题:html下划线颜色的修改方法
本文路径:http://hbruida.cn/article/ihgocj.html