CSS表格寬度自適應，是CSS表格設計中非常重要的一部分。因為表格是網頁設計中必不可少的元素，所以必須掌握好表格的寬度自適應。下面我們來介紹一下如何通過CSS實現表格的寬度自適應。

table{
width: 100%;
border-collapse: collapse;
}

以上就是實現表格寬度自適應必須要使用的CSS代碼。其中，width: 100%是指表格元素總寬度占據包容它的容器的100%寬度。border-collapse: collapse是指合并單元格的邊框，這樣使表格看起來更美觀。

下面我們來看看如何設置表格列的寬度。

th, td{
width: auto;
text-align: left;
padding: 5px 10px;
}

以上代碼的作用是：

• 設置單元格的寬度為自動，由表格內容自動決定每個單元格的寬度；
• 表格內容左對齊；
• 定義單元格內上下左右的內邊距。

如果要保證表格的每一列寬度相等，可以通過設置表頭的寬度來實現。代碼如下：

th{
width: calc(100% / 3);
}

以上代碼表示將每個表頭寬度設為整個表格容器的1/3，從而使每一列的寬度相等。如果列數不確定，可以用calc()方法來計算每個表頭的寬度。

以上就是實現CSS表格寬度自適應需要的CSS代碼和設置列寬的方法。掌握這些技術可以更好地美化網頁表格。