任务二

任务完成前

  • 同样是接上一个任务
  • 任务的题目如下:
作业题目.png
  • 估时:5mins
  • 我的思考:采用caption,table,tr,th,td,thead,tbody标签,名称,2016-11-22,小计,总价需要采用rowspan,colspan,其中,rowspan是合并两个竖行,colspan是合并两个横行

开始写代码

<!DOCTYPE html><html lang="en">
  <head>    
    <meta charset="UTF-8">    
    <title>Title</title>
 </head>
 <body>    
    <table border="1">        
       <caption>购物车</caption>        
          <thead>            
             <tr>                
              <th rowspan="2">名称</th>                
              <th colspan="2">2016-11-22</th>                
              <th rowspan="2">小计</th>            
          </tr>            
          <tr>               
             <th>重量</th>                
              <th>单价</th>            
          </tr>        
      </thead>       
      <tbody>           
           <tr>                
            <td>苹果</td>               
            <td>3公斤</td>                
            <td>5元/公斤</td>                
            <td>15元</td>            
          </tr>            
          <tr>                
             <td>香蕉</td>                
            <td>2公斤</td>                
            <td>6元/公斤</td>                
            <td>12元</td>            
          </tr>            
          <tr>                
              <td colspan="3" style="text-align: center">总价</td>   
              <td>27元</td>                                                                        
        </tr>        
        </tbody>    
    </table>
</body>
</html>
我的代码.png

任务完成

  • 用时:14mins
  • 分析原因:对制表可能没有理解的很深,但自己觉得开了codefordream上的东西已经理解了,所以导致我估时不准。
  • 总价那里我使用了css的字体居中,但是老师似乎要求不使用css,在这里是一个问题。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容