HTML&CSS基础学习笔记1.17-表格头部与尾部

阅读更多

表格的头部和尾部

既然有标签表示表格的主体,那么自然表格的头部和尾部也有对应的标签。

HTML中使用标签表示表格的头部,使用标签表示表格的尾部。

 

有了头部和尾部之后,

里的结构就是这样:

Html代码 
  1. <table>    
  2.      
  3.   <thead>    
  4.     <tr>    
  5.         ...    
  6.     tr>    
  7.   thead>    
  8.      
  9.   <tfoot>    
  10.     <tr>    
  11.         ...    
  12.     tr>    
  13.   tfoot>    
  14.      
  15.   <tbody>    
  16.     <tr>    
  17.         ...    
  18.     tr>    
  19.   tbody>    
  20.      
  21. table>    

 现在就让我们来试着用下这个2个标签吧:

Html代码 
  1. >    
  2. <html lang="en">    
  3. <head>    
  4.     <meta charset="UTF-8">    
  5.     <title>使用thead和tfoot标签title>    
  6. head>    
  7. <body>    
  8.     <h2>使用thead和tfoot标签h2>    
  9.     <table border="1">    
  10.         <thead>    
  11.             <tr><td>序号td><td>物品td><td>价格td>tr>    
  12.         <tbody>    
  13.             <tr><td>1、td><td>铅笔td><td>¥1.00td>tr>    
  14.             <tr><td>2、td><td>毛笔td><td>¥5.00td>tr>    
  15.             <tr><td>3、td><td>钢笔td><td>¥10.00td>tr>    
  16.         tbody>    
  17.         <tfoot>    
  18.             <tr><td colspan="2">总计:td><td>¥16.00td>tr>    
  19.     table>    
  20. body>    
  21. html>    

结果会是怎么样?可以前往码芽网学习体验哦http://www.mayacoder.com/lesson/index

查看吧~~~


HTML&CSS基础学习笔记1.17-表格头部与尾部_第1张图片
 

  • HTML&CSS基础学习笔记1.17-表格头部与尾部_第2张图片
  • 大小: 4.9 KB
  • 查看图片附件

你可能感兴趣的:(html,表格,thead,tfoot)