HTML第六課：表格展示

學生花名冊

學生花名冊

效果示列

在這里插入圖片描述

代碼展示

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>個人信息列表</title>
</head>
<body>
<h1>個人信息列表</h1>
<!-- 創建表格，border 屬性設置邊框寬度 -->
<table border="1" width="90%"><!-- 表格表頭 --><thead><tr><th><input type="checkbox" id="selectAll"></th><th>姓名</th><th>年齡</th><th>性別</th><th>職業</th><th>手機號碼</th><th>郵箱</th></tr></thead><!-- 表格主體 --><tbody><tr><td><input type="checkbox"></td><td>劉一</td><td>22</td><td>男</td><td>學生</td><td>13800138001</td><td>liuyi@example.com</td></tr><tr><td><input type="checkbox"></td><td>陳二</td><td>28</td><td>女</td><td>設計師</td><td>13800138002</td><td>chener@example.com</td></tr><tr><td><input type="checkbox"></td><td>張三</td><td>30</td><td>男</td><td>程序員</td><td>13800138003</td><td>zhangsan@example.com</td></tr><tr><td><input type="checkbox"></td><td>李四</td><td>25</td><td>女</td><td>教師</td><td>13800138004</td><td>lisi@example.com</td></tr><tr><td><input type="checkbox"></td><td>王五</td><td>35</td><td>男</td><td>醫生</td><td>13800138005</td><td>wangwu@example.com</td></tr><tr><td><input type="checkbox"></td><td>趙六</td><td>27</td><td>女</td><td>律師</td><td>13800138006</td><td>zhaoliu@example.com</td></tr><tr><td><input type="checkbox"></td><td>孫七</td><td>40</td><td>男</td><td>工程師</td><td>13800138007</td><td>sunqi@example.com</td></tr><tr><td><input type="checkbox"></td><td>周八</td><td>23</td><td>女</td><td>編輯</td><td>13800138008</td><td>zhouba@example.com</td></tr><tr><td><input type="checkbox"></td><td>吳九</td><td>32</td><td>男</td><td>銷售</td><td>13800138009</td><td>wujiu@example.com</td></tr><tr><td><input type="checkbox"></td><td>鄭十</td><td>29</td><td>女</td><td>會計</td><td>13800138010</td><td>zhengshi@example.com</td></tr></tbody>
</table>
</body>
</html>

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/news/921345.shtml
繁體地址，請注明出處：http://hk.pswp.cn/news/921345.shtml
英文地址，請注明出處：http://en.pswp.cn/news/921345.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！