表格边框
border 属性、border-collapse 合并、虚线/实线样式
表格边框
表格的边框样式决定可读性——默认是双层边框，通常需要合并或美化。
学完本章你将： 掌握 border 属性、border-collapse 合并、虚线/实线。
基本边框
html
<!-- HTML 属性（已不推荐） -->
<table border="1">
<!-- CSS 方式（推荐） -->
<style>
table, th, td {
border: 1px solid black;
}
</style>合并边框
html
<style>
table {
border-collapse: collapse; /* 单层边框 */
/* border-collapse: separate; 双层边框（默认） */
}
th, td {
border: 1px solid #ddd;
}
</style>边框样式
html
<style>
th, td {
border: 2px solid #333; /* 实线 */
/* border: 2px dashed red; 虚线 */
/* border: 2px dotted blue; 点线 */
/* border: 3px double #999; 双线 */
/* border: none; 无边框 */
}
</style>只显示水平线
html
<style>
table { border-collapse: collapse; width: 100%; }
th, td {
border-bottom: 1px solid #ddd; /* 只有下边框 */
padding: 8px;
}
</style>