利用HTML代码中的s标签标注过期信息或不准确价格-html教程-PHP中文网

不推荐用标记过期价格，因其语义仅为“不再相关”而非“时间性失效”；应使用配合准确表达价格变更及生效时间。

利用html代码中的s标签标注过期信息或不准确价格

用 `<s></s>` 标签标记过期价格是否合规

不推荐。HTML5 中 <s></s> 的语义是“不再准确或不再相关的内容”，但它**不表示时间性过期**，也不传达“已被替代”或“已失效”的明确意图。搜索引擎和屏幕阅读器会将其理解为内容被弃用，但不会关联到日期、时效性或新旧对比。

常见误用场景：在电商页写 <s>$199</s> $149，指望它自动表达“原价已失效”。实际效果只是视觉上加删除线，语义层面既不告诉爬虫“这是旧价”，也不帮视障用户理解“这个价格已被新价取代”。

`<del></del>` 比 `<s></s>` 更合适的原因

<del></del> 明确表示“已被删除的内容”，且支持 datetime 属性，能标注删除发生的时间点——这对价格变更、政策更新等场景至关重要。

可用 datetime 记录价格失效时间：<del datetime="2024-03-15T10:30">$199</del>
辅助技术（如读屏软件）会朗读“已删除，2024年3月15日上午10点30分”
搜索引擎更倾向将 <del></del> 内容识别为被主动撤回的信息，而非单纯样式修饰
<s></s> 不允许嵌套 <ins></ins>，而 <del></del> 可自然搭配 <ins></ins> 构成完整变更记录

正确组合：用 `<del></del>` + `<ins></ins>` 表达价格变更

仅划掉旧价不够，必须同时标明新价及其生效依据。否则语义断裂，机器无法推断“哪个是当前有效值”。

推荐写法：

<p>价格更新：<del datetime="2024-03-15T10:30">9</del> <ins datetime="2024-03-15T10:30">9</ins></p><div class="aritcle_card flexRow artxards">
											<div class="artcardd flexRow">
												<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx"><img
														src="https://img.php.cn/upload/skill/000/000/081/179051045119472.jpg" alt="html-to-pptx" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
												<div class="aritcle_card_info flexColumn">
													<a rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx" class="overflowclass">html-to-pptx</a>
													<p class="overflowclass">将多页 HTML 演示文稿转换为美化的 PPTX 文件，便于分享和分发。</p>
												</div>
												<a rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
												</a>
											</div>
										</div>

注意点：

datetime 值必须是完整 ISO 8601 时间（含时区或 Z），不能只写日期
两个标签的 datetime 值应一致，表示同一时刻完成替换
避免把 <ins></ins> 放在 <del></del> 外部（如 <del>...</del><ins>...</ins> 是合法的，但包裹在同一 <p></p> 内更利于上下文理解）
不要用 CSS 覆盖 <del></del> 的默认删除线样式而不提供替代文本——这会让依赖样式的用户丢失语义