<del> Элемент HTML для удалённого текста

Элемент <del> HTML обозначает диапазон текста, удалённого из документа. Например, его можно использовать при отображении режима «отслеживания изменений» или различий в исходном коде. Элемент <ins> можно использовать для противоположной цели: обозначения текста, добавленного в документ.

Попробуйте

<blockquote>
  There is <del>nothing</del> <ins>no code</ins> either good or bad, but
  <del>thinking</del> <ins>running it</ins> makes it so.
</blockquote>

del {
  text-decoration: line-through;
  background-color: #ffbbbb;
  color: #555555;
}

ins {
  text-decoration: none;
  background-color: #d4fcbc;
}

blockquote {
  padding-left: 15px;
  border-left: 3px solid #d7d7db;
  font-size: 1rem;
}

Этот элемент часто (но не обязательно) отображается с использованием стиля зачёркивания текста.

Атрибуты

Атрибуты этого элемента включают глобальные атрибуты.

cite

URI ресурса, поясняющего изменение (например, протокола встречи).

datetime

Этот атрибут указывает время и дату изменения и должен содержать корректную строку даты с необязательным временем. Если значение не удаётся разобрать как дату с необязательной строкой времени, у элемента нет связанной временной метки. Формат строки без времени описан в разделе Строки дат. Формат строки, включающей дату и время, описан в разделе Строки локальных даты и времени.

Доступность

Большинство средств чтения с экрана в настройках по умолчанию не сообщают о наличии элемента del. Чтобы он озвучивался, можно использовать свойство CSS content вместе с псевдоэлементами ::before и ::after.

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

del::before {
  content: " [deletion start] ";
}

del::after {
  content: " [deletion end] ";
}

Некоторые пользователи программ чтения с экрана намеренно отключают озвучивание контента, который делает речь излишне многословной. Поэтому важно не злоупотреблять этим способом и применять его только в тех случаях, когда незнание об удалении контента может помешать пониманию.

• Краткая заметка о том, как сделать вашу разметку доступнее | Vispero
• Настройка стилей текста | Adrian Roselli

Примеры

<p><del>This text has been deleted</del>, here is the rest of the paragraph.</p>
<del><p>This paragraph has been deleted.</p></del>

Результат

Техническая сводка

Спецификации

Совместимость с браузерами

См. также

• Элемент <ins> для вставок в текст
• Элемент <s> для зачёркивания текста без обозначения его удаления