CSSで行を取り消し線の色を変更する方法

方法1: text-decoration-colorプロパティを使用する方法

<style>
  .strikethrough {
    text-decoration: line-through;
    text-decoration-color: red; /* 取り消し線の色を赤に設定 */
  }
</style>
<p class="strikethrough">このテキストは取り消し線が引かれ、赤色になります。</p>

方法2: background-imageを使用する方法

<style>
  .strikethrough {
    background-image: linear-gradient(to bottom, red, red);
    background-repeat: repeat;
    background-position: 0% 100%;
    background-size: 100% 1px;
    color: transparent;
  }
</style>
<p class="strikethrough">このテキストは取り消し線が引かれ、赤色になります。</p>

方法3: ::after疑似要素を使用する方法

<style>
  .strikethrough {
    position: relative;
  }
  .strikethrough::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 50%;
    width: 100%;
    height: 1px;
    background-color: red; /* 取り消し線の色を赤に設定 */
  }
</style>
<p class="strikethrough">このテキストは取り消し線が引かれ、赤色になります。</p>

これらの方法を使用すると、ブログ投稿で行を取り消し線の色を変更することができます。それぞれの方法には異なるアプローチがありますので、必要に応じて適切な方法を選択してください。