CSS表格常常用來展示數據和信息。不過，如果要在表格中添加圖片，你可能會遇到一個問題：當圖片寬度超過表格寬度時，表格會被壓縮，影響整個頁面的布局。所以，我們需要一種方法，讓表格能夠根據圖片的寬度自動調整寬度。

/* 在 CSS 中定義表格和圖片寬度 */
table {
width: 100%;
border-collapse: collapse;
}
img {
width: 100%;
height: auto;
max-width: 100%;
}
/* 針對不同的設備屏幕大小，使用媒體查詢 */
@media screen and (min-width: 600px) {
/* 在大屏幕上，設置表格最大寬度為600px */
table {
max-width: 600px;
}
}

以上代碼中，我們使用了兩個關鍵屬性：表格的width和max-width，以及圖片的width、height和max-width。這些屬性有助于控制表格和圖片的寬度，使它們能夠根據不同的屏幕大小自動調整大小。

通過上述代碼，我們讓表格的寬度自動調整為其父級元素的寬度，以確保表格始終在設備屏幕上占據合適的寬度。同時，我們也讓圖片的寬度自適應其父級元素，以確保圖片能填滿表格，并被完全顯示。

此外，我們也設置了一個媒體查詢，以便在大屏幕上對表格進行最大寬度的限制。這有助于使表格在不同的屏幕大小下看起來更加自然、舒適。

總之，通過以上的方法，我們可以讓 CSS 表格隨圖片變寬而變寬，以確保頁面布局的合理性和美觀度。如果你也遇到了類似的問題，可以嘗試上述方法，看看是否有幫助。