<s>:删除线元素

<s> HTML 元素呈现带有删除线或穿过它的线的文本。使用 <s> 元素来表示不再相关或不再准确的事物。但是，<s> 在表示文档编辑时并不合适；为此，请酌情使用 <del> 和 <ins> 元素。

¥The <s> HTML element renders text with a strikethrough, or a line through it. Use the <s> element to represent things that are no longer relevant or no longer accurate. However, <s> is not appropriate when indicating document edits; for that, use the <del> and <ins> elements, as appropriate.

Try it

属性

¥Attributes

该元素仅包含全局属性。

¥This element only includes the global attributes.

示例

¥Examples

css

.sold-out {
  text-decoration: line-through;
}

html

<s>Today's Special: Salmon</s> SOLD OUT<br />
<span class="sold-out">Today's Special: Salmon</span> SOLD OUT

结果

¥Result

无障碍问题

¥Accessibility concerns

大多数屏幕阅读技术在其默认配置中均未声明 s 元素的存在。可以使用 CSS content 属性以及 ::before 和 ::after 伪元素来声明它。

¥The presence of the s element is not announced by most screen reading technology in its default configuration. It can be made to be announced by using the CSS content property, along with the ::before and ::after pseudo-elements.

css

s::before,
s::after {
  clip-path: inset(100%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

s::before {
  content: " [start of stricken text] ";
}

s::after {
  content: " [end of stricken text] ";
}

一些使用屏幕阅读器的人故意禁止播放会造成额外冗长的内容。因此，重要的是不要滥用此技术，并且仅在不知道内容已被删除会对理解产生不利影响的情况下应用它。

¥Some people who use screen readers deliberately disable announcing content that creates extra verbosity. Because of this, it is important to not abuse this technique and only apply it in situations where not knowing content has been struck out would adversely affect understanding.

技术总结

¥Technical summary

内容类别	措辞内容, 流动内容.
允许的内容	措辞内容.
标签遗漏	无，开始和结束标记都是强制性的。
允许的父级	任何接受措辞内容的元素。
隐式 ARIA 角色	`deletion`
允许的 ARIA 角色	任何
DOM 接口	`HTMLElement`

规范

Specification
HTML Standard # the-s-element

¥Specifications

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility

也可以看看

¥See also

<strike> 元素是 <s> 元素的另一个版本，已经过时，不应再在网站上使用。
如果数据已被删除，则将使用 <del> 元素。
CSS text-decoration-line 属性用于实现 <s> 元素以前的视觉效果。