我们专注攀枝花网站设计 攀枝花网站制作 攀枝花网站建设
成都网站建设公司服务热线:400-028-6601

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

怎么在HTML标签中给文本设置修饰线-创新互联

这篇文章给大家介绍怎么在HTML标签中给文本设置修饰线,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。

创新互联是一家业务范围包括IDC托管业务,虚拟主机、主机租用、主机托管,四川、重庆、广东电信服务器租用,托管服务器,成都网通服务器托管,成都服务器租用,业务范围遍及中国大陆、港澳台以及欧美等多个国家及地区的互联网数据服务公司。

html是什么

html的全称为超文本标记语言,它是一种标记语言,包含了一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体,html文本是由html命令组成的描述性文本,html命令可以说明文字,图形、动画、声音、表格、链接等,主要和css+js配合使用并构建优雅的前端网页。

text-decoration属性介绍

text-decoration 属性是用来设置文本修饰线呢,text-decoration 属性一共有4个值。

 text-decoration属性值说明表

 
作用
none去掉文本修饰线
underline设置下划线
overline设置上划线
line-through设置删除线

HTML标签自带修饰线

在开始实践text-decoration 属性之前,笔者先给大家普及下HTML 中的标签自带修饰线如:u标签s标签 ,若有不全大家可以在下面评论中告诉笔者,毕竟笔者也是前端的一个小白,希望和大家相互交流,互帮互助,共同进步。

 u标签

下面让我们进入u 标签的实践,u 标签自带的是文本下划线。

代码块





    
    
    
    设置文本修饰线
  


    成功不是击败别人,而是改变自己

结果图

怎么在HTML标签中给文本设置修饰线

注意:u 标签也可以配合HTML 中的其他标签使用,举例:将u 标签嵌套到h2 标签中使用。

代码块

成功不是击败别人,而是改变自己

s标签

下面让我们进入s 标签的实践,s 标签自带的是文本删除线。

代码块





    
    
    
    设置文本修饰线
  


    成功不是击败别人,而是改变自己

结果图

怎么在HTML标签中给文本设置修饰线

注意:s 标签也可以嵌套,和u 标签一致,笔者就不过多的介绍了。

none去除修饰线

让我们进入text-decoration 属性的none 值实践,实践内容如:笔者将HTML 页面中的s 标签自带的删除线给去除掉。

代码块





    
    
    
    设置文本修饰线
    


    成功不是击败别人,而是改变自己

结果图

怎么在HTML标签中给文本设置修饰线

注意:u 标签、s 标签、包括text-decoration 属性值的所有的修饰线都可以去掉哦。

underline设置下划线

让我们进入text-decoration 属性的underline 值实践,实践内容如:笔者将HTML 页面中的h3 标签中的文本设置一个下划线。

代码块





    
    
    
    设置文本修饰线
    


    

成功不是击败别人,而是改变自己

结果图

怎么在HTML标签中给文本设置修饰线

overline设置上划线

让我们进入text-decoration 属性的overline 值实践,实践内容如:笔者将HTML 页面中的h3 标签中的文本设置一个上划线。

代码块





    
    
    
    设置文本修饰线
    


    

成功不是击败别人,而是改变自己

结果图

怎么在HTML标签中给文本设置修饰线

line-through设置删除线

让我们进入text-decoration 属性的line-through 值实践,实践内容如:笔者将HTML 页面中的h3标签中的文本设置一个删除线。

代码块





    
    
    
    设置文本修饰线
    


    

成功不是击败别人,而是改变自己

结果图

怎么在HTML标签中给文本设置修饰线

关于怎么在HTML标签中给文本设置修饰线就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。


网站名称:怎么在HTML标签中给文本设置修饰线-创新互联
文章链接:http://mswzjz.cn/article/dpiios.html

其他资讯