CSS表格只要下邊框是一種常見的網頁設計方式,可以讓表格更加清晰干凈。下面我們來看一下如何用CSS實現這個效果。
table { border-collapse: collapse; } td, th { border: 1px solid black; border-bottom: none; /* 只去掉底部邊框 */ padding: 8px; } tr:last-child td { border-bottom: 1px solid black; /* 最后一行的邊框保留 */ }
首先要注意,需要將表格的邊框合并(border-collapse),這樣才能保證設置底部邊框不留下間隔。
然后,通過將所有單元格的邊框設置為1px黑色實線,并將底部邊框設為none,則可以去掉所有單元格的底部邊框。
最后,將表格的最后一行的所有單元格的底部邊框重新設置為1px黑色實線,就可以保留最后一行的邊框了。
使用以上的CSS樣式,就可以實現一個只有表格底部邊框的效果。記得將CSS樣式應用到對應的表格中即可。
上一篇mysql 查詢拆分