HTML前端表格简单代码
<!DOCTYPE html>
<html>
<head>
<title>简单的HTML表格</title>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
padding: 5px;
text-align: left;
}
</style>
</head>
<body>
<h2>我的第一个 HTML 表格</h2>
<table style="width:100%">
<tr>
<th>姓名</th>
<th>年龄</th>
<th>城市</th>
</tr>
<tr>
<td>张三</td>
<td>28</td>
<td>上海</td>
</tr>
<tr>
<td>李四</td>
<td>32</td>
<td>北京</td>
</tr>
<tr>
<td>王五</td>
<td>45</td>
<td>广州</td>
</tr>
</table>
</body>
</html>
这段代码创建了一个简单的HTML表格,包含了表格的基本结构、样式和数据行。表格具有边框,并且通过border-collapse: collapse;
属性合并了单元格之间的边框,使得表格看起来整洁、整齐。通过内部样式表(<style>
标签),我们还为表格、表头和单元格添加了样式,包括边框宽度、边框合并以及内边距和文本对齐方式。
评论已关闭