最近，我在做一個網(wǎng)站的時候，發(fā)現(xiàn)了一個奇怪的問題：我的CSS表格高度竟然多了4像素！

經(jīng)過一番調(diào)試，我發(fā)現(xiàn)了這個問題的根源。

table {
border-collapse: collapse;
height: 100px;
 }
td {
height: 20px;
border: 1px solid black;
}

在上面的代碼中，我設(shè)置了Table的高度為100px，同時每個TD的高度為20px。

然而，當(dāng)我在頁面上展示這個表格的時候，它的高度竟然變成了104px！

經(jīng)過進一步調(diào)試，我發(fā)現(xiàn)這個問題的原因在于邊框折疊。

邊框折疊是CSS表格的一個特性，它可以讓相鄰的單元格邊框合并在一起，從而使表格看起來更加整潔。

但是，在這個特性下，我們設(shè)置的表格高度實際上包含了所有單元格的邊框厚度。

那么，我們該如何解決這個問題呢？

其實很簡單，我們只需要將table的高度設(shè)置為100px加上單元格邊框的厚度就可以了。

table {
border-collapse: collapse;
height: 108px;
}
td {
height: 20px;
border: 1px solid black;
}

通過這種方法，我們就可以解決CSS表格高度多了4像素的問題啦！