css表格的边框线怎么设置

作者：﹏丶夜，深了发布日期:2026-02-02 浏览:11

/* 设置表格边框线的示例代码 */

/* 1. 设置整个表格的边框 */
table {
    border: 1px solid black; /* 表格整体边框，宽度为1px，实线，颜色为黑色 */
}

/* 2. 设置表格单元格的边框 */
td, th {
    border: 1px solid black; /* 单元格边框，宽度为1px，实线，颜色为黑色 */
}

/* 3. 合并相邻单元格的边框（避免双线效果） */
table {
    border-collapse: collapse; /* 合并相邻单元格的边框 */
}

/* 4. 设置不同的边框样式 */
table {
    border: 2px dashed red; /* 表格整体边框，宽度为2px，虚线，颜色为红色 */
}

td, th {
    border: 2px dotted blue; /* 单元格边框，宽度为2px，点线，颜色为蓝色 */
}

解释说明：

border：用于设置元素的边框，可以指定边框的宽度、样式和颜色。
border-collapse：用于控制表格边框是否合并。collapse表示合并相邻单元格的边框，避免双线效果。
td 和 th：分别表示表格中的数据单元格和表头单元格。

通过以上代码，你可以轻松设置表格及其单元格的边框样式。

上一篇：css 文字加下划线

下一篇：css scale 中心点