CSS 表格在 Div 中居中顯示 在網頁開發中，表格的應用相當廣泛，而將表格居中在頁面上更能增加網頁的美觀度，在 CSS 中，我們可以使用 div 和 table 標簽來實現表格居中。 首先，我們需要設置外部 div 的寬度和高度，并將其設置為居中。代碼如下：

<div class="table-container">
<table>
<tr>
<th>標題1</th>
<th>標題2</th>
<th>標題3</th>
</tr>
<tr>
<td>內容1</td>
<td>內容2</td>
<td>內容3</td>
</tr>
<tr>
<td>內容4</td>
<td>內容5</td>
<td>內容6</td>
</tr>
</table>
</div>
<style>
.table-container {
width: 50%;
margin: 0 auto;
text-align: center;
}
table {
width: 100%;
}
td, th {
border: 1px solid #000;
}
</style>

在上面的代碼中，我們為外部 div 添加了 .table-container 樣式，將其寬度設置為 50%，然后使用 margin 屬性將其居中。值得注意的是，如果你希望表格的寬度為 100%，則也可以將 .table-container 的寬度設置為 100%。 接下來，我們需要為表格中的內容設置樣式，例如為 td 和 th 元素設置邊框，代碼如下：通過上述樣式，我們能夠為表格添加黑色邊框，讓它的美觀度得到了很大的提升。 總結 通過上面的內容，我們了解到了如何使用 CSS 將表格與 Div 元素進行結合，從而實現表格的居中顯示。在實際開發中，我們需要根據實際情況進行調整，以達到更好的用戶體驗。