用html5製作表格時，只是簡單的想要實現表格內有邊框，結果出現了雙邊框和單元格獨立（有間距）的問題。本經驗為大家分享一下我的處理過程及解決方法。
方法/步驟
首先為大家展示一下最原始的代碼和效果。直接在table中用td劃分的表格會默認隱藏邊框。
接下來我們用css來增加樣式，為table增加邊框。
table {
border: 1px solid #804040;
}
修改後的效果是整個table增加了外邊框，table內還是沒有邊框。
然後我們用css來為td增加邊框。
table td {
border: 1px solid #804040;
}
修改後的效果是每個td都增加了邊框，顯示效果為table全部顯示單邊框。
接下來我採用了網上普遍推薦的方法，即td顯示左上兩個邊，table顯示右下兩個邊，進而實現但邊框表格效果。
table {
border-right: 1px solid #804040;
border-bottom: 1px solid #804040;
}
table td {
border-left: 1px solid #804040;
border-top: 1px solid #804040;
}
修改後的效果符合預期，但是內部邊框顯示不連續，原因是內部單元格之間有間距。
最後，我們在table中增加css代碼：border-collapse:collapse;用來消除單元格間距。
即：
table {
border-right: 1px solid #804040;
border-bottom: 1px solid #804040;
border-collapse:collapse;
}
table td {
border-left: 1px solid #804040;
border-top: 1px solid #804040;
}
修改後單元格間距消除，完美實現效果。
以上是我的處理方法，希望能幫助到大家。