HTML <del> 标签用于标记网站上已删除的文本内容。它代表“已删除的文本”。它表示已从文档中删除的文本范围。当呈现“跟踪更改”或源代码提供不同信息时,可以使用此功能。当我们使用 <del> 标签时,浏览器通常会在已删除的文本中划出一行。
注意:若要在文档中查找已删除和插入的内容,请使用带有 <del> 的 <ins> 标签,这将显示已删除和插入的文本。
语法
<del >...</del >
属性
<del> 标签支持 HTML 的 全局属性和事件属性。除此之外,还支持一些特定属性,这些属性在下面列出:
属性 | 值 | 描述 |
---|---|---|
cite | URL | 定义来源的 URL。 |
datetime | YYYY-MM-DDThh:mm:ssTZD | 保留删除文本的日期和时间。 |
<del> 标签的示例
在这些示例中,我们将看到 <del> 标签在 text 元素上的用法。我们还将使用内部 CSS 来装饰我们的 <del> 标签。
<del> 标签简单示例
在下面的示例中,我们正在创建一个 HTML 文档,并使用 <del> 标签在不需要的内容上划一行。
<!DOCTYPE html>
<html>
<body>
<h2>Example of del tag </h2>
<p>
启科普(www.qikepu.com)提供了
<del>编程的</del>,
基础技术教程.
</p>
<p>
<del>I am deleted paragraph</del>
</p>
</body>
</html>
<del> 标签使用属性示例
在此示例中,我们将使用 cite 和 datetime 属性来提及上下文的源和删除日期。
<!DOCTYPE html>
<html>
<body>
<h2>Example of del tag </h2>
<p>
启科普提供了编程的基础技术教程
<del cite=
"https://www.qikepu.com/index.html">
教程</del>,
so their caption is easy to learn.
</p>
<p>
<del datetime="2024-01-03T12:00:00Z">I am deleted paragraph</del>
</p>
</body>
</html>
<del> 标签设置CSS样式
考虑以下示例,我们使用<del> 标签为不需要的内容提供删除线,并使用 CSS 属性设置已删除内容的背景颜色。
<!DOCTYPE html>
<html>
<head>
<style>
del {
text-decoration: line-through;
background-color: #fbb;
color: #555;
}
ins {
text-decoration: none;
background-color: #d4fcbc;
}
</style>
</head>
<body>
<p>There is <del>nothing</del>
<ins>no code</ins> either good or bad, but <del>thinking</del>
<ins>running it</ins> makes it so.
</p>
<p>启科普提供了编程的基础技术教程, <del>启科普提供了编程的基础技术教程</del>. </p>
</body>
</html>
支持的浏览器
浏览器 | ![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|---|
<del> | Yes | Yes | Yes | Yes | Yes |