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> |
