Зачеркнутый текст CSS: основы и примеры

Зачеркнутый текст в CSS можно достичь с помощью свойства text-decoration: line-through. Оно применяет различные стили к тексту, включая создание зачеркнутого эффекта.

Пример кода, демонстрирующий применение зачеркивания текста в CSS:

p {
  text-decoration: line-through;
}

В данном примере мы применяем стиль зачеркивания ко всем абзацам <p> на странице. Теперь любой текст, находящийся внутри таких абзацев, будет выглядеть зачеркнутым.

Если вы хотите применить стиль только к определенному элементу или классу, вы можете указать конкретный селектор вместо p. Например:

h1 {
  text-decoration: line-through;
}

В этом случае только заголовки первого уровня <h1> будут иметь зачеркнутый текст.

Вы также можете комбинировать свойство text-decoration с другими свойствами, чтобы создать эффекты, такие как зачеркнутый текст с другими стилями. Например, вы можете использовать свойство color для изменения цвета зачеркнутого текста, и свойство font-style для добавления курсива.

p {
  text-decoration: line-through;
  color: red;
  font-style: italic;
}

В этом примере текст будет зачеркнут, окрашен в красный цвет и отображен курсивом.

В заключение, свойство text-decoration в CSS предоставляет возможность добавить зачеркивание к тексту. Вы можете применить это свойство к различным элементам и добавить другие стили для создания уникального визуального эффекта. Надеюсь, этот ответ был полезным и информативным!