首页一个有边框的表格代码

一个有边框的表格代码

时间: 2024-09-20 12:04:28 浏览: 34

创建一个有边框的表格，你可以使用HTML的`<table>`元素结合CSS样式来实现。下面是一个基础示例： ```html <!DOCTYPE html> <html lang="zh"> <head> <style> table { width: 100%; border-collapse: collapse; /* 合并相邻单元格的边框 */ } th, td { border: 1px solid #ccc; /* 设置所有单元格的边框 */ padding: 8px; /* 内容与边框之间的空白 */ text-align: left; } th { background-color: #f2f2f2; /* 表头背景色 */ font-weight: bold; /* 加粗表头文字 */ } </style> </head> <body> <table> <tr>  <th>列1</th> <th>列2</th> <th>列3</th> </tr> <tr>  <td>内容1</td> <td>内容2</td> <td>内容3</td> </tr>  </table> </body> </html> ``` 在这个例子中，`<table>`标签定义了整个表格，`<th>`用于表头单元格，`<td>`用于数据单元格。CSS样式设置了边框、内边距和表头的背景色。

阅读全文