在HTML表格上适当放置缩进的地方正确显示Python代码

Question

我目前正在用HTML和CSS编写Wordpress页面，并且有大量的Python代码要插入使用HTML创建的表格单元格中。

但是，当我创建表时，它会删除Python代码的所有缩进并自动将它们向左或居中对齐。

是否可以使用HTML和CSS正确显示Python缩进？

    <table style="width: 100%;">
    <tbody>
    <tr>
    <th style="text-align: left;" scope="row">
   {
    "aa": [
    {
      "xxa": "yya",
      "xxb": "yyb",
      "xxc": "yyc",
      "xxd": "yyd"
    },
    {
      "xxe": "yye",
      "xxf": "yyf",
      "xxg": "yyg",
      "xxh": "yyh"
    }
    ],</th>
    <td>Some text to describe the code on the left cell</td>
    </tr>
    <tr>
    <th style="text-align: left;" scope="row">
      "bb": 
    {
      "xa": "ya",
      "xb": yb,
    }
    }</th>
    <td>Some text to describe the code on the left cell</td>
    </tr>
    </tbody>
    </table>