1、表格元素（table）
表格初始化：
<!-- 表格元素的容器table --> <table border="1px;"> <!-- 表头行：thead，表头单元格：th --> <thead> <th>序号</th> <th>姓名</th> <th>年龄</th> </thead> <!-- 表体：tbody，行：tr，单元格：td --> <tbody> <tr> <td>1</td> <td>jasmine</td> <td>18</td> </tr> </tbody> </table>
2、表单元素(form)
| 表单组成 | 标签 |
| 表单容器 | <form> |
| 输入框 | <input> |
| 描述输入框 | <label> |
| 选择容器 | <select> |
| 选择项 | <option> |
| 按钮 | <button> |
表单初始化：
<!-- 表单容器：form标签，提示输入信息：placeholder属性， 描述文本框：label标签，标签指向id文本：for属性 选择器容器：select标签，选项：option 提交按钮：submit，普通按钮：button--> <form action=""> <label for="username">用户名</label> <input type="text" id="username" placeholder="请输入用户名"> <label for="password">密码</label> <input type="text" id="password" placeholder="请输入密码"> <select id="sex"> <option value="男">男</option> <option value="女">女</option> </select> <button type="submit">提交</button> <button type="reset">重置</button> <button type="button">按钮</button> </form>
3、源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>表格和表单元素</title> </head> <body> <!-- 表格元素的容器table --> <table border="1px;"> <!-- 表头行：thead，表头单元格：th，横向合并单元格：colspan --> <thead> <th colspan="4">学生信息列表</th> </thead> <thead> <th>序号</th> <th>班级</th> <th>姓名</th> <th>年龄</th> </thead> <!-- 表体：tbody，行：tr，单元格：td，纵向合并单元格：rowspan --> <tbody> <tr> <td>1</td> <td rowspan="3">web3</td> <td>jasmine</td> <td>18</td> </tr> <tr> <td>2</td> <td>QiQi</td> <td>19</td> </tr> <tr> <td>3</td> <td>jasmine_qiqi</td> <td>20</td> </tr> </tbody> </table> <!-- 表单容器：form标签，提示输入信息：placeholder属性， 描述文本框：label标签，标签指向id文本：for属性 选择器容器：select标签，选项：option 提交按钮：submit，普通按钮：button--> <form action=""> <label for="username">用户名</label> <input id="username" type="text" placeholder="请输入用户名"> <label for="password">密码</label> <input id="password" type="password" placeholder="请输入密码"> <input type="radio" name="" id=""> <select name="" id=""> <option value="男">男</option> <option value="女">女</option> </select> <input type="submit" value="登陆"> <input type="button" value="登陆"> </form> </body> </html>
