如何将包含自定义方框样式的table元素居中对齐？

table作为块级元素默认宽度由内容撑开、左对齐，可选用以下任意一种方案实现居中：

• 方案1（推荐）：直接给table添加margin: 0 auto行内样式，无需修改父元素代码
  修改后的完整代码如下：

<table style="margin: 0 auto;">
<tbody>
    <tr>
        <td>TURKEY - SUPER LIG</td>
        <td>#colspan#</td>
        <td>Tips</td>
    </tr>
    <tr>
        <td>Besistas  <strong style="border:3px; border-style:solid; border-color:#601C08; padding-right: 0.5em; padding-left: 0.2em; padding-top: 0.2em; padding-bottom: 0.2em;">-</strong> <strong style="border:3px; border-style:solid; border-color:#601C08; padding-right: 0.5em; padding-left: 0.2em; padding-top: 0.2em; padding-bottom: 0.2em;"></strong> Adana</td>
        <td>#colspan#</td>
        <td><strong style="border:3px; border-style:solid; border-color:white; padding-right: 0.5em; padding-left: 0.5em; padding-top: 0.2em; padding-bottom: 0.2em; background-color: none; color: none;">1</strong></td>
    </tr>
    <tr>
        <td>DENMARK - DBU POKALEN</td>
        <td>#colspan#</td>
        <td>Tips</td>
    </tr>
    <tr>
        <td>FC Helsingoer <strong style="border:3px; border-style:solid; border-color:#601C08; padding-right: 0.5em; padding-left: 0.2em; padding-top: 0.2em; padding-bottom: 0.2em;">-</strong> <strong style="border:3px; border-style:solid; border-color:#601C08; padding-right: 0.5em; padding-left: 0.2em; padding-top: 0.2em; padding-bottom: 0.2em;">-</strong> OB</td>
        <td>#colspan#</td>
        <td><strong style="border:3px; border-style:solid; border-color:white; padding-right: 0.5em; padding-left: 0.5em; padding-top: 0.2em; padding-bottom: 0.2em; background-color: none; color: none;">Over 2.5</strong></td>
    </tr>
</tbody>
</table>

• 方案2：通过父容器控制的话，给table的父元素添加text-align: center属性，同时给table添加display: inline-table属性即可生效。

补充说明：代码内的#colspan#为占位符，需替换为实际的colspan="数值"属性（比如合并2列就写colspan="2"），避免布局出现异常。

当前实际效果：

内容的提问来源于stack exchange，提问作者Winzbets CEO