HTML <S> Tag

Definition

The <s> tag is used to mark content that is no longer accurate or relevant with a strikethrough. It is not suitable to indicate document edits; use the <del> element instead.

Example

<p>The following items are on sale:</p>
<ul>
  <li>4 Spoons</li>
  <li><s>4 forks</s> 2 forks</li>
  <li>4 candles</li>
</ul>

Usage

• Both the starting and closing tags are required.
• Do not use for marking up document edits. You should use the <ins> and <del> elements instead.

Attributes

The <s> element only supports the Global Attributes.

Best Practices

• Most screen readers do not announce the <s> element. You can use CSS to add hidden content before and after the <s> element, which screen readers will announce.

  For example, you can adapt this technique:

  <style>
  s::before, s::after {
  content:" [Deletion start] ";
  clip-path: inset(100%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  width: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  }
  s::after {
  content:" [Deletion end] ";
  }
  </style>
  <p>
  <s>This deleted text</s> is shown with a strike through.
  </p>

  Some users of screenreaders may disable announcing such long-winded content, so the best practice is probably to avoid using the <s> element unless absolutely necessary.

Specification

• HTML Living Standard Specification
• HTML5 Specification

Browser Support

Desktop

Mobile