CSS表格是實現網頁布局的一個重要組件。表格可以用于展示數據、展示圖片、以及顯示其他網頁元素。為了讓表格更加靈活和自適應，我們可以通過百分比和像素相結合的方式來設置CSS表格。下面我們來詳細講解下該方法的具體應用。

<table>
<tr>
<th width="20%">編號</th>
<th width="80%">產品描述</th>
</tr>
<tr>
<td>001</td>
<td>產品一: 紅色 T 恤衫</td>
</tr>
<tr>
<td>002</td>
<td>產品二: 黃色連衣裙</td>
</tr>
</table>

以上代碼演示了如何將列的寬度設置為百分比。在這個例子中，我們使用了20%和80%的百分比來設置表頭的兩列的寬度。由于百分比是相對于父元素的，所以這里的百分比將按照表格整個寬度進行計算。因此，在一個自適應布局中，表格的列將按比例調整其大小。

然而，在某些情況下，使用百分比是不夠靈活的。例如，如果我們要設置表格中的一些單元格的寬度為一個固定的像素值，而其他的列則需要自適應大小。在這種情況下，我們可以將列的寬度設置為像素。

<table>
<tr>
<th width="20%">編號</th>
<th width="80%">產品描述</th>
</tr>
<tr>
<td width="50px">001</td>
<td>產品一: 紅色 T 恤衫</td>
</tr>
<tr>
<td width="50px">002</td>
<td>產品二: 黃色連衣裙</td>
</tr>
</table>

在這個例子中，我們將單元格的寬度設置為50像素，而其他列則按比例自適應大小。這樣，表格將會顯示出相應的效果，這種方法不僅能靈活實現表格的布局，而且使得數據更加清晰、易讀、易于查找。