文章の一部を訂正した風のスタイル

Ads

Result


こういうやつ。insとdelタグを使用します

フォントやrotateを使う事でリアル感が出せますね。
日本語ならふい字とかまきば、おひさま等がよさ気でしょうか

css

del {
  position: relative;
  text-decoration: none;
}
del:before {/*削除線*/
  content: "";
  background: #a30000;
  height: 1px;
  position: absolute;
  left: -3px;
  top: 50%;
  width: 90%;
  transform: rotate(1deg);
}
del:after {/*削除線*/
  content: "";
  background: #a30000;
  height: 1.25px;
  position: absolute;
  right: 3px;
  bottom: 32%;
  width: 95%;
  transform: rotate(-0.25deg);
}
ins {/*手書き風にして角度を変更 fontは https://fonts.google.com/specimen/Caveat */
  color: #a30000;
  font-family: 'Caveat', cursive;
  font-size: 1.25em;
  text-decoration: none;
  position: absolute;
  margin-top: -20px;
  margin-left: -50px;
  transform: rotate(-4.5deg);
}

html

<p>The early bird catches <del>the worm</del><ins>less sleep</ins>.</p>

via

del-ins pair