前端表格标签实现的代码示例
程序员文章站
2022-05-11 09:55:17
前端表格标签实现的代码示例
前端表格标签实现的代码示例
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <!-- <table> 属性：border:表格边框 width:表格的宽度 align:表格的对齐方式 bgcolor:背景颜色 <tr> 代表行 <td> 代表单元格 属性：colspan 列合并 rowspan 行 合并 <caption> 表格的标题 作用：(1)简单的实现一个表格样式 (2)进行布局 <thead> <tbody> <tfoot> 作用：分块加载 用户体验比较好 --> <table border="1" width="50%" align="center" bgcolor="yellow"> <tr align="center"> <td>1--1</td> <td>1--2</td> <td>1--3</td> </tr> <tr align="center"> <td>2--1</td> <td>2--2</td> <td>2--3</td> </tr> <tr align="center"> <td>3--1</td> <td>3--2</td> <td>3--3</td> </tr> </table> <hr/> <table border="1" width="50%" align="center" bgcolor="yellow"> <caption>19成绩表</caption> <tr align="center"> <th>1--1</th> <th>1--2</th> <th>1--3</th> </tr> <tr align="center"> <td>2--1</td> <td>2--2</td> <td>2--3</td> </tr> <tr align="center"> <td>3--1</td> <td>3--2</td> <td>3--3</td> </tr> </table> <hr/> <table border="1" width="50%" align="center" bgcolor="yellow"> <caption>19成绩表</caption> <tr align="center"> <th>1--1</th> <th>1--2</th> <th>1--3</th> </tr> <tr align="center"> <td rowspan="2">2--1</td> <td colspan="2">2--2</td> </tr> <tr align="center"> <td>3--2</td> <td>3--3</td> </tr> </table> </body> </html>
上一篇： 国产手机厂商面临集体危机