表格html代码
当创建HTML表格时，你可以使用<table>元素以及相关的表格元素，如<tr>、<th>和<td>。
html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Table Example</title>
</head>
<body>
<h2>Sample HTML Table</h2>
<table border="1">
<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
<td>Row 1, Cell 3</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
<td>Row 2, Cell 3</td>
</tr>
<tr>
<td>Row 3, Cell 1</td>
<td>Row 3, Cell 2</td>
<td>Row 3, Cell 3</td>
</tr>
</tbody>
</table>
</body>
</html>
在这个示例中，<table>元素用于定义整个表格，<thead>用于定义表头部分，<tbody>用于定义表格的主体部分。在表头和主体中，使用<tr>定义行，使用<th>定义表头单元格，使用<td>定义数据单元格。border="1"属性用于显示表格边框。你可以根据需要修改表格的内容和样式。
html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
table {
width: 50%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
th {
background-color: #f2f2f2;
}
tr:nth-child(even) {
background-color: #f9f9f9;
}
</style>
<title>Styled HTML Table</title>
</head>
<body>
<h2>Styled HTML Table</h2>
<table>
<thead>
<tr>
<th>Employee ID</th>
<th>Name</th>
<th>Department</th>
</tr>
</thead>
<tbody>
<tr>
<td>001</td>
<td>John Doe</td>
<td>IT</td>
</tr>
<tr>
<td>002</td>
<td>Jane Smith</td>
<td>HR</td>
</tr>
<tr>
<td>003</td>
<td>Bob Johnson</td>
<td>Finance</td>
</tr>
</tbody>
</table>
</body>
</html>
在这个例子中，通过添加了一些CSS样式，实现了使用border-collapse: collapse;来合并单元格边框。使用padding属性来增加单元格内边距。使用background-color属性来设置表头和奇数行的背景颜色，以增强可读性。使用width属性来设置表格的宽度。
你可以根据自己的需求进一步调整这些样式和属性。希望这能帮助你创建符合你设计需求的HTML表格。
