在網站開發中，表格是一種常見的元素，用來展示數據。但是在不同的設備上，尤其是移動設備上，表格可能會出現顯示不完整、滾動條影響用戶體驗等問題。這時候，我們需要使用 CSS 來解決這些問題。 一個表格要想自適應大小，就需要為父元素設置一個寬度，并將子元素表格的寬度設置為100%。代碼如下：

.parent {
width: 100%;
}
table {
width: 100%;
}

可以看到，我們首先為父元素設置了寬度為100%，這使得它可以根據屏幕的大小而自適應調整大小。然后，我們將表格的寬度也設置為100%，這使得表格可以按照父元素的寬度自適應調整大小。 如果表格中的某些列內容太長，在小屏幕上會導致逐漸壓縮，給用戶帶來不必要的麻煩。為了解決這個問題，我們可以使用 CSS 中的媒體查詢來設置表格在不同尺寸的屏幕上的寬度。 例如，在大屏幕上，我們希望表格占據整個父元素的寬度，而在小屏幕上，則希望表格只占用父元素的 80%。這時候，我們可以這么做：

.parent {
width: 100%;
}
table {
width: 100%;
}
@media (max-width: 767px) {
table {
width: 80%;
}
}

在這段代碼中，我們使用了媒體查詢，當屏幕的最大寬度小于 767 像素時，將表格的寬度設置為 80%。這樣，在小屏幕上，就能有效地避免表格內容的壓縮，同時又不會破壞布局。 總的來說，表格自適應大小是一個比較簡單卻很實用的技巧，在移動設備越來越普及的現在，更加需要我們在網站開發中廣泛使用。