我使用以下代码.如何使用CSS将此表放在页面的中心？
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>The Main Page</title>
</head>
<body>
<table>
<tr>
<td><button class="lightSquare"></button></td>
<td><button class="darkSquare"></button></td>
<td><button class="lightSquare"></button></td>
<td><button class="darkSquare"></button></td>
<td><button class="lightSquare"></button></td>
<td><button class="darkSquare"></button></td>
<td><button class="lightSquare"></button></td>
<td><button class="darkSquare"></button></td>
</tr>
</table>
</body>
</html>
这是我的代码。我正在尝试做的就是将此表放在容器的中央。但是，当我使用“容器”类时，默认情况下它会向左对齐，当我将div使用“容器-流体类”时，它将使用全宽。我想将桌子水平居中。有人可以帮忙吗？
<!-- Container (Pricing Section) -->
<div id="pricing" class="container-fluid">
<table class="table table-bordered table-striped">
<thead><tr>
<th>Material Name</th>
<th>Rate (INR)</th>
</tr>
</thead>
<tbody style="">
<tr>
<td>Books</td>
<td>7.00(per KG)</td>
</tr>
<tr>
<td>Soft Plastic</td>
<td>15.00(per KG)</td>
</tr>
<tr>
<td>Hard Plastic</td>
<td>2.00(per KG)</td>
</tr>
</tbody>
</table>
<div>
这是一个屏幕 截图
我知道“容器流体”使用全宽度，但我也只使用了“容器”类，但这无济于事。请指教...
