首頁 > web前端 > css教學 > 如何為 HTML 表格的每一行新增底部邊框?

如何為 HTML 表格的每一行新增底部邊框?

Mary-Kate Olsen
發布: 2024-12-17 16:58:17
原創
429 人瀏覽過

How Can I Add a Bottom Border to Each Row of an HTML Table?

在表格行中新增邊框

使用 HTML 表格時,您可能會遇到需要在每行底部新增邊框的情況。然而,嘗試使用內聯樣式或直接 CSS 規則來實現此目的可能會無效。

為了實現這種預期效果,將 border-collapse:collapse 屬性合併到 CSS 中至關重要。此屬性折疊了相鄰單元格之間的共享邊框,從而產生更清晰、更結構化的表格佈局。透過將此屬性套用至表格規則,底部邊框的 CSS 規則將如預期生效。

範例:

table {
  border-collapse: collapse;
}

tr {
  border-bottom: 1pt solid black;
}
登入後複製

這將確保每個表格中的行底部有黑色實心邊框,增強了表格資料的視覺吸引力和組織性。

以上是如何為 HTML 表格的每一行新增底部邊框?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板