html如何给文本文字添加删除线?两种方法添加删除线(实例)

相信大家在各大商场网站浏览时,总是会看到某个产品的原价标记是多少,再在原价上添加一个明显的删除线,表明现在做促销,现价又改成了多少,给用户一个直观的差距感,吸引用户购买!那么这样的删除线效果是如何添加到文本文字上的?本章就给大家介绍html给文本文字添加删除线的两种方法。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。

首先我们来看看在html页面上给文本文字添加删除线效果的两种方法分别是什么:

html  标签元素实现文本文字添加删除线效果;

html  标签元素实现文本文字添加删除线效果;

下面我们具体来介绍这两种方法是如何实现文本文字添加删除线效果的,通过简单的例子来介绍。

立即学习“前端免费学习笔记(深入)”;

html  标签

标签可定义加删除线文本定义。

html <strike> 标签

这是测试代码,被删除了

效果图:

1.jpg

如例子中所示,只要在 标签中添加好文本文字,就可实现想要的效果。 标签可以缩写为 标签,实现的效果不变。

Netscape 和 Internet Explorer 都支持这两种写法。

注意: 标签( 标签)在 HTML 4 和 XHTML 中已经不再赞成使用了,意思就是不再使用了;早晚有一天将会消失。

一般都会建议不使用 标签,而改为使用  标签实现删除线效果,下面我们就来介绍html  标签。

html  标签

 标签定义文档中已被删除的文本。

html <del> 标签

原价:20,现在促销价:10

效果图:

2.jpg

如例子中所示, 标签的使用和 标签一样都很简单、方便。并且所有主流浏览器都支持 标签。

注意:请与 标签配合使用,来描述文档中的更新和修正。

总结:以上就是本篇文的全部内容,其实除了用上述的两种方法添加删除线,还可以使用css来实现删除线,同时设置删除线样式。后续文章【css如何添加删除线?css text-decoration属性设置删除线(代码实例)】中将会介绍如何使用css设置删除线样式。希望能对大家的学习有所帮助,更多相关教程请访问 HTML视频教程!

相关推荐:php公益培训视频教程

以上就是html如何给文本文字添加删除线?两种方法添加删除线(实例)的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1547109.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月21日 18:50:56
下一篇 2025年12月21日 18:51:24

相关推荐

  • html如何给table表单加边框

    本章给大家介绍html如何给table表单加边框。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 一般来说,给表格加边框都会出现不同的问题,以下是给表格加边框后展现比较好的方式 table,table tr th, table tr td { border:1px solid #00…

    2025年12月21日 好文分享
    000
  • 如何在HTML中引入外部页面(iframe标签法)

    在页面布局时,会将部分外部页面引入到html中,这篇文章就和大家讲讲如何在html中引入外部页面之iframe标签法。有需要的朋友可以参考一下,希望对你有用。 首先,最容易想到的应该是使用iframe,虽然html5废除了frame,但是依旧保留了iframe,我们仍可以继续使用,iframe有一个…

    好文分享 2025年12月21日
    000
  • 如何在HTML中引入外部页面(HTML imports法) 

    在页面布局时,会将部分外部页面引入到html中,这篇文章就和大家讲讲如何在html中引入外部页面之html imports法。有需要的朋友可以参考一下,希望对你有用。 HTML imports提供了一种在一个HTML文档中包含和重用另一个HTML文档的方法。目前谷歌已经全面支持HTML import…

    好文分享 2025年12月21日
    000
  • 图文详解HTML页面中添加图片的三种方法

    在页面布局时,经常需要在页面中插入图片,那你知道如何在html中添加图片吗?这篇文章就给大家介绍html页面中插入图片的三种方法,感兴趣的朋友可以参考一下,希望对你有所帮助。 方法一、用HTML中的img标签添加图片 最简单,最常用的就是直接使用img标签,并且可以根据需要设置图片的大小,代码如下:…

    2025年12月21日
    000
  • 详解html中 position属性用法(四种)

    这篇文章主要介绍了html中 position用法,文中逐一给大家介绍了position的四个属性值,感兴趣的朋友跟随小编一起看看吧 position的四个属性值: 1.relative2.absolute3.fixed4.static 下面分别讲述这四个属性。 sub1 sub2 1. relat…

    好文分享 2025年12月21日
    000
  • 常用HTML代码大全(初学者必备)

    对于前端工作人员来说,每天都会接触到div和css ,有些知识不常用就容易忘了,最近把常用的html代码进行了总结,写了篇文章,方便自己以后查看,同时也分享给大家,希望对你有用。 文件类型 (放在档案的开头与结尾) 文件主题 (必须放在「文头」区块内) 文头 (描述性资料,像是「主题」) 文体 (文…

    好文分享 2025年12月21日
    000
  • 分享查看页面源代码的四种方法

    前端开发人员在浏览网页时,遇到自己喜欢的网页,总想看看代码是怎么写的,也有些人需要对网页源代码进行修改,那你知道怎么查看一个网页的源代码吗?这篇文章就和大家讲讲如何查看源代码,以及不同浏览器的查看源代码的快捷键。有需要的朋友可以参考一下,希望对你有用。 一、源代码是什么 一般来讲,通过html代码能…

    2025年12月21日
    000
  • html支持的列表标签:无序列表、有序列表和定义列表(介绍)

    从某种意义上讲,不是描述性的文本的其他任何内容都可以认为是列表。例如:人口普查、太阳系、家谱、参观菜单,甚至你的所有朋友都可以表示为一个列表或列表里的列表。那么在html列表样式有哪些?本章给大家带来html支持的列表标签:无序列表、有序列表和自定义列表(介绍)。有一定的参考价值,有需要的朋友可以参…

    2025年12月21日 好文分享
    000
  • html之table和select操作(介绍)

    本章给大家带来html之table和select操作(介绍),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 table标签和其它标签不一样,他有属性和方法! table属性:   rows      可以得到table的row集合   cells      得到table所有单元格…

    好文分享 2025年12月21日
    000
  • 图文详解标签中alt属性和title属性的区别

    在页面布局时,必然会用到图片,说到图片,大家对于img标签的alt属性和title属性应该不陌生,那你知道两者在什么情况下使用吗?这篇文章就和大家讲讲img标签中alt属性和title属性的区别。感兴趣的朋友继续往下看吧。 alt属性和title属性的相同点和区别 相同之处:它们都会出现一个小浮层,…

    2025年12月21日
    000
  • html中的meta标签是什么?meta标签的属性介绍

    本章给大家介绍html中的meta标签是什么?meta标签的属性介绍。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 什么是meta标签?        meta标签是html标记head区的一个关键标签,它位于HTML文档的 和之间(有些也不是在和之间)。它提供的信息虽然用户不可见…

    2025年12月21日
    000
  • html如何实现表单的选择框效果?单选框与多选框的实现(代码实例)

    在使用表单提交数据的时候,为了减少用户的一些操作,使用选择框是一个好主意。本章给大家介绍html如何实现表单的选择框效果?单选框与复选框的实现(代码实例)。通过单选框代码和复选框代码实例,实现单选框样式和多选框样式,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 一、选择框种类与语法…

    2025年12月21日
    000
  • 如何实现网页版别踩白块的游戏 (代码示例)

    本篇文章给大家带来的内容是如何使用如何实现网页版别踩白块的游戏 (代码示例) ,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 自己最近一直想做个小项目,但是自己代码水平太烂了,做不了大系统,索性利用毕生所学写个小游戏,哈哈哈别踩白块这个游戏相信很多人都在手机上玩过,今天我们就来做一…

    2025年12月21日
    000
  • html中图片显示方式—–img与background的区别

    本章给大家介绍html中图片显示方式—–img与background的区别,让大家可以了解在html中让图片显示的两种方法的区别。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 一、从解析机制看 img属于html标签,background是css方法。一个页…

    好文分享 2025年12月21日
    000
  • 如何区分HTML和XHTML?HTML和XHTML的区别在哪?

    本章给大家介绍如何区分html和xhtml?html和xhtml的区别在哪?有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 什么是XHTML? XHTML是用XML语言重写了HTML,也可以理解为XHTML是HTML的过渡语言,它比HTML语言更严谨,基本语言都还是沿用HTML的标签…

    好文分享 2025年12月21日
    000
  • canvas 学习 3—画坐标系

    无论您是新手,还是老手,本教程都值得一读。 网格#c1{border:1px solid black;}window.onload = function(){var oCanvas = document.getElementById(‘c1’)var gd = oCanvas.getContext(…

    2025年12月21日
    000
  • Go元素的关键字所在–chan通道

    html validate是指html验证。它是通过与标准html规则进行比较的方式,分析html文档、标记出错误和非标准代码的处理过程。web页面使用html进行渲染,而html本身采用了html规范作为其规则和标准。通过验证html代码穿越多重浏览器标准! chan chan又称之为通道,形式类…

    好文分享 2025年12月21日
    000
  • 前端开发中要如何注释语句?注释的三种方法(介绍)

    在前端开发中,往往为了一些原因(比如:代码说明,标注等等),需要用到注释语句。那么到底要怎样注释注释语句,注释语句的一些注意事项是什么?本章给大家带来前端开发中要如何注释语句?注释的三种方法(介绍)。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 一、HTML 标签  1.定义: 注…

    2025年12月21日
    000
  • html5与传统html的区别,有哪些新增的和废除的元素?

    这篇文章围绕html展开,主要讲了html5与传统html的区别,以及一些html5新增的元素和废除的元素,有需要的小伙伴可以参考一下,希望对你有帮助。 一. HTML5语法的改变 该知识点所说变化指的是基于HTML4基础上所定义的改变,主要有如下: 1、HTML5的文件扩展符(.html或.htm…

    好文分享 2025年12月21日
    000
  • html中big标签如何使用?html big标签的使用实例

    html中的big标签的使用情况,big标签都知道是一个基础的放大标签,但是我们都在什么元素中加过big标签呢,今天这篇文章讲述了在几个元素中加big标签的详情,现在就开始阅读本篇文章吧 首先我们需要知道html big标签的使用说明: HTML big标签是定义比普通文本大一点的标签,我们在很多时…

    2025年12月21日
    000

发表回复

登录后才能评论
关注微信