HTML & CSS - テキストに打ち消し線を表示する

テキストに打ち消し線を表示する

テキストに打ち消し線を表示するには、CSS の text-decoration プロパティで定義します。text-decoration プロパティの値は line-through を指定します。

<!DOCTYPE html>
<html lang="ja">
  ...
  <p class="textdecoration_linethrough">
    テキストに打ち消し線を指定した文章です。
  </p>
  ...
</html>
テキストに打ち消し線を表示する - HTML
.textdecoration_linethrough{
    text-decoration: line-through;
}
テキストに打ち消し線を表示する - CSS

プロパティの値は line-through の他にも、overlineunderlinenone があります。

overline
テキストに上線を引きます。
underline
テキストに下線を引きます。
none
テキストに線を引かないようにします。

フォントについての CSS 設定例は、読みやすいフォントの CSS 設定例を参照してください。

関連記事