HTML_实现一个简单表格

一、任务目标

HTML_实现一个简单表格_第1张图片
预期效果图

二、任务分解

  • 首先是一个表格,边框为1,标题为 “ 购物车 ”
  • 其次分为标题(th)和内容(tbody
  • 标题两行,内容三行,一共是五行四列
  • 其中包含行合并(colspan)和列合并(rowspan

三实现

  • 代码:

购物车

名称 2016-11-22 小计
重量 单价
苹果 3公斤 5元/公斤 15元
香蕉 2公斤 6元/公斤 12元
总价 27元
  • 效果图:
HTML_实现一个简单表格_第2张图片
自己实现的效果图

四、总结

  • 通过任务分解,很清楚的知道了具体要做的步骤,实现起来很容易

你可能感兴趣的:(HTML_实现一个简单表格)