在HTML中如果想要创建表格,我们有专门的完善的表格标签来实现,那就是table标签,这是一个闭合标签。
在HTML表格中,会将表格分为若干行,在把每行分为若干单元格,也就是列,然后单元格内就可以存放我们操作EXCEL时所需要存放的数据,也可以是图片、列表、段落、表单、水平线一个嵌套表格等。
<table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table>
在HTML表格中最大的闭合标签就是<table>,其所有的子标签需要在<table>标签中。
1、其中<tr>标签定义的是行,<td>定义的是列,也就是单元格;
2、上述代码中有两个<tr>闭合标签,意思就是说定义了一个表格有两行;在<tr>标签中有两个<td>标签,也就是说一行有两个单元格.
显示如下:
row1,cell1 |
row1,cell2 |
row2,cell1 |
row2,cell2 |
3、在HTML表格中,每行可以单独定义有多少个单元格,它与其他行互不干涉。
标签 |
作用 |
<table> |
定义表格 |
<tr> |
定义表格的行 |
<td> |
定义表格的单元格 |
<th> |
定义表格的表头(文本加粗居中),与<td>用法相同 |
<caption> |
定义表格标题 |
<colgroup> |
定义表格列的组 |
<col> |
定义表格列的属性 |
<thead> |
定义表格的页眉 |
<tbody> |
定义表格的主体 |
<tfoot> |
定义表格的页脚 |
代码:
<html> <head> <meta charset='utf-8'> <title>HTML表格实例应用</title> </head> <body> <table border="1"> <thead> <tr> <th>名字</th><th>年纪</th><th>工作</th> </tr> </thead> <tfoot> <tr> <td>张三</td><td>18</td><td>教师</td> </tr> </tfoot> <tbody> <tr> <td>李四</td><td>26</td><td>工人</td> </tr> <tr> <td>王五</td> <td>30</td><td>律师</td> </tr> </tbody> </table> </body> </html>
显示如下:
小伙伴们动手试试吧~
jQuery2021-01-08
jQuery2021-01-07
MySQL2020-12-13
电脑2020-12-12
服务器2020-12-06
电脑2020-10-06