这篇文章给大家介绍怎么在HTML标签中给文本设置修饰线,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。
创新互联是一家业务范围包括IDC托管业务,虚拟主机、主机租用、主机托管,四川、重庆、广东电信服务器租用,托管服务器,成都网通服务器托管,成都服务器租用,业务范围遍及中国大陆、港澳台以及欧美等多个国家及地区的互联网数据服务公司。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
标签自带的是文本下划线。
代码块
设置文本修饰线 成功不是击败别人,而是改变自己
结果图
注意:u
标签也可以配合HTML
中的其他标签使用,举例:将u
标签嵌套到h2
标签中使用。
代码块
成功不是击败别人,而是改变自己
s标签
下面让我们进入s
标签的实践,s
标签自带的是文本删除线。
代码块
设置文本修饰线 成功不是击败别人,而是改变自己
结果图
注意:s
标签也可以嵌套,和u
标签一致,笔者就不过多的介绍了。
none去除修饰线
让我们进入text-decoration
属性的none
值实践,实践内容如:笔者将HTML
页面中的s
标签自带的删除线给去除掉。
代码块
设置文本修饰线 成功不是击败别人,而是改变自己
结果图
注意:u
标签、s
标签、包括text-decoration
属性值的所有的修饰线都可以去掉哦。
underline设置下划线
让我们进入text-decoration
属性的underline
值实践,实践内容如:笔者将HTML
页面中的h3
标签中的文本设置一个下划线。
代码块
设置文本修饰线 成功不是击败别人,而是改变自己
结果图
overline设置上划线
让我们进入text-decoration
属性的overline
值实践,实践内容如:笔者将HTML
页面中的h3
标签中的文本设置一个上划线。
代码块
设置文本修饰线 成功不是击败别人,而是改变自己
结果图
line-through设置删除线
让我们进入text-decoration
属性的line-through
值实践,实践内容如:笔者将HTML
页面中的h3标签中的文本设置一个删除线。
代码块
设置文本修饰线 成功不是击败别人,而是改变自己
结果图
关于怎么在HTML标签中给文本设置修饰线就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。