主题
  • 默认模式
  • 浅蓝色模式
  • 淡红色模式
  • 深夜模式

定义和用法

<del>是 HTML 中用于表示已删除文本的标签,通常浏览器会以删除线样式显示被<del>包裹的内容。

<del>元素在淘宝、拼多多等主流电商平台的页面中,被广泛使用。

<del>元素的基本语法:

<p>原价:<del>¥100</del> 现价:¥80</p>

使用实例

接下来用多种实例演示<del>标签的用法,来深化您对<del>的理解。

1. cite - 提供一个URL,解释为什么删除此内容

实例代码 运行代码
复制
<del cite="https://example.com/reasons.html">这段内容已被删除</del>

2. datetime - 指定删除的日期和时间

实例代码 运行代码
复制
<del datetime="2023-10-01T08:00:00Z">过期的信息</del>

3. 与 <ins> 标签配合使用

实例代码 运行代码
复制
<p>
    会议时间:<del datetime="2023-11-01">11月1日</del>
    <ins datetime="2023-11-05">11月5日</ins>
</p>

全局属性

<del>标签还支持 HTML 中的全局属性


事件属性

<del>标签还支持 HTML 中的事件属性


默认的 CSS 设置

大多数浏览器将使用以下默认值显示<del>元素:

del {
    text-decoration: line-through;
}

注意事项

  • 不要仅为了装饰效果使用<del>,应该使用 CSS 的text-decoration: line-through
  • 对于标记不再相关或准确的内容,<del>比单纯删除内容更好。
  • 标签不同,<del>有明确的语义含义。

浏览器支持

Chrome 浏览器 IE 浏览器 Firefox 浏览器 Safari 浏览器 Opera 浏览器
支持 支持 支持 支持 支持



评论区 0
发表评论