您的位置：首页 > Web前端 > HTML

用HTML实现课程表

2016-06-02 16:08 357 查看 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>课程表</title>
<link rel="stylesheet" type="text/css" href="schedule2.css">
</head>
<body>
<table class="schedule" border="1" bordercolor="#ccc" cellspacing="0">
<caption>课程表</caption>
<tr>
<th>项目</th>
<th colspan="5">上课</th>
<th colspan="2">休息</th>
</tr>
<tr>
<th class="col-a">星期</th>
<th class="col-b">星期一</th>
<th class="col-b">星期二</th>
<th class="col-b">星期三</th>
<th class="col-b">星期四</th>
<th class="col-b">星期五</th>
<th class="col-b">星期六</th>
<th class="col-b">星期天</th>
</tr>
<tr>
<td class="td-head" rowspan="4">上午</td>
<td>PHP</td>
<td>HTML</td>
<td>CSS</td>
<td>JavaScript</td>
<td>iOS</td>
<td rowspan="4" colspan="2">休息</td>
</tr>
<tr>
<td>iOS</td>
<td>PHP</td>
<td>HTML</td>
<td>CSS</td>
<td>JavaScript</td>
</tr>
<tr>
<td>JavaScript</td>
<td>iOS</td>
<td>PHP</td>
<td>HTML</td>
<td>CSS</td>
</tr>
<tr>
<td>CSS</td>
<td>JavaScript</td>
<td>iOS</td>
<td>PHP</td>
<td>HTML</td>
</tr>
<tr>
<td class="td-head" rowspan="2">下午</td>
<td>HTML</td>
<td>CSS</td>
<td>JavaScript</td>
<td>iOS</td>
<td>PHP</td>
<td rowspan="2" colspan="2">休息</td>
</tr>
<tr>
<td>HTML</td>
<td>CSS</td>
<td>PHP</td>
<td>JavaScript</td>

b5a4
<td>iOS</td>
</tr>
</table>
</body>
</html>
css文件
*{margin: 0;padding: 0;}th{background-color: blanchedalmond;}td{background-color: aliceblue;}.schedule{width: 740px;margin: 0 auto;margin-top: 30px;}.col-a{width: 40px;}.col-b{width: 100px;}.td-head{text-align: center;}

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航