【CSS】Table要素のセルに斜線を引く

タイトル通り、Table要素のセルに斜線を引く方法についてです。
なお、私は <td> 要素に引きたかったので、そのように記述しました。

参考に…というかまるっとコードをコピーさせていただいた記事はこちらから。

【html/CSS】tableのマスに斜線を引く方法
https://csshtml.work/table-shasen/

コードは以下の通りです。

<table>
  <tbody>
    <tr><th>見出し1</th><td>内容</td></tr>
    <tr><th>見出し2</th><td class="border"></td></tr>
  <tbody>
</table>

table td.border {
  background-image: linear-gradient(to right top, transparent calc(50% - 0.5px), #E4EFFF 50%, #E4EFFF calc(50% + 0.5px), transparent calc(50% + 1px));
}

上のようなテーブル要素を作成し、一番右下の <td> に斜線を引いています。

background: linear-gradient() はグラデーションを描くのに使うのですが、上記のような使い方をすると、ギザギザしない綺麗な斜線を描くことができるとのことでした。
私はまだ完全に理解出来てはいないので…詳しくは上の参考サイトをご参照ください。

以上、CSS で Table 要素のセルに斜線を引く方法についてでした。
ご参考になれば幸いです。