表格的编写,课程表

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             th,td{
 8                 padding: 0;
 9             }《由于th和td有自己默认的margin》
10             table{
11                 border-collapse:collapse;
12             }《整体边框加上以后会发现象巧克力一样重叠,需要border-collaborate:collaborate来去除重叠》
13         </style>
14     </head>
15     <body>
16         <table border="1">《表格整体加上边框》
17             <thead>
18                 <tr>
19                     <th colspan="2">星期一</th>
20                     <th>星期二</th>
21                     <th>星期三</th>
22                     <th>星期四</th>
23                 </tr>
24             </thead>        《thead是表头 th是表头的每一个单元格》
《tbody是主体的,td是主体的么一个单元格》
                  《合并单元格:合并行的单元格是:colspan=“2”表示合并两个单元各自。
                         合并列的单元格是:rowspan=“num”表示合并num个单元个子》。
25 <tbody> 26 <tr> 27 <td rowspan="3">HTML&CSS零基础课程</td> 28 <td>HTML&CSS零基础课程</td> 29 <td>HTML&CSS零基础课程</td> 30 <td>HTML&CSS零基础课程</td> 31 <td>HTML&CSS零基础课程</td> 32 </tr> 33 <tr> 34 <td>HTML&CSS零基础课程</td> 35 <td>HTML&CSS零基础课程</td> 36 <td>HTML&CSS零基础课程</td> 37 <td>HTML&CSS零基础课程</td> 38 </tr> 39 <tr> 40 <td>HTML&CSS零基础课程</td> 41 <td>HTML&CSS零基础课程</td> 42 <td>HTML&CSS零基础课程</td> 43 <td>HTML&CSS零基础课程</td> 44 </tr> 45 </tbody> 46 </table> 47 </body> 48 </html>

 

posted on 2016-03-01 19:23  hduhdc  阅读(494)  评论(0编辑  收藏  举报