用html代码做一份相亲择偶表
时间: 2024-09-23 21:05:39 浏览: 32
HTML是一种标记语言,常用于创建网页结构。要制作一份简单的相亲择偶表,我们可以利用表格 `<table>` 和相关的列 `<tr>`、行 `<td>` 来组织信息。以下是一个基本的例子:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>相亲择偶表</title>
<style>
table {
width: 50%;
border-collapse: collapse;
margin: auto;
}
th, td {
text-align: center;
padding: 10px;
border: 1px solid #ccc;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<h1>相亲择偶表</h1>
<table>
<thead>
<tr>
<th>序号</th>
<th>姓名</th>
<th>年龄</th>
<th>职业</th>
<th>兴趣爱好</th>
<th>是否接受进一步交流</th>
</tr>
</thead>
<tbody>
<!-- 这里可以添加每个单身用户的行数据 -->
<tr>
<td>1</td>
<td>张三</td>
<td>28</td>
<td>IT工程师</td>
<td>阅读、旅行</td>
<td><input type="checkbox" id="contact1"></td>
</tr>
<!-- 添加更多行... -->
</tbody>
</table>
</body>
</html>
```
在这个例子中,用户可以在每个单身人士的信息后面选择是否愿意进一步交流。你可以通过JavaScript来处理这些交互,比如记录用户的选择。