查看: 449|回复: 0

[HTML代码] 网站购物车界面(div+css实现)

发表于 2018-4-5 08:00:01





叮咚网购物车

  1. </head>
  2. <body>
  3. <div class="main">
  4. <div class="top">
  5. <div id="logo">
  6. <img src="img/logo.gif" title="叮咚网logo" alt="logo"></img>
  7. <img src="img/header.png" title="img1" alt="img1" id="img1"></img>
  8. <a href="登录.html" target="_blank" id="d"><font color="darkcyan">登录</font></a>&nbsp;&nbsp;
  9. <a href="注册.html" target="_blank"><font color="darkcyan">注册</font></a>&nbsp;&nbsp;
  10. <a href="购物车.html" target="_blank"><font color="darkcyan">购物车</font></a>
  11. </div>
  12. </div>
  13. <div class="downMenu">
  14. <a href="#" target="_blank">首页</a>&nbsp;&nbsp;
  15. <a href="#" target="_blank">手机数码</a>&nbsp;&nbsp;
  16. <a href="#" target="_blank">电脑办公</a>&nbsp;&nbsp;
  17. <a href="#" target="_blank">学习用品</a>&nbsp;&nbsp;
  18. <a href="#" target="_blank">家具电器</a>
  19. <input id="search" type="text" name="search" value="search">
  20. <input type="submit" name="submit" value="submit">
  21. </div>
  22. <div id="indent">
  23. <font color="#000000" size="5px" weight="bold">订单详情</font>
  24. <table border="1px" width="960px" height="100px">
  25. <tr id="tr1">
  26. <td>图片</td>
  27. <td>商品</td>
  28. <td>价格</td>
  29. <td>数量</td>
  30. <td>小计</td>
  31. <td>操作</td>
  32. </tr>
  33. <tr id="tr2">
  34. <td>
  35. <img src="img/dadonggua.jpg" width="80px" height="60px">
  36. </td>
  37. <td>
  38. <font color="aqua"> 有机蔬菜&nbsp;&nbsp;大冬瓜</font>
  39. </td>
  40. <td>
  41. ¥298.00
  42. </td>
  43. <td>
  44. <input type="text" name="price" value="1">
  45. </td>
  46. <td>
  47. ¥596.00
  48. </td>
  49. <td>
  50. 删除
  51. </td>
  52. </tr>
  53. </table>
  54. <div id="price">
  55. <font color="darkorange" id="font1">登录后是否享有优惠</font>&nbsp;&nbsp;
  56. 赠送积分:
  57. <font color="darkorange">596</font>
  58. 商品金额:
  59. <font color="darkorange">¥596.00元</font><br />
  60. <font color="deepskyblue" id="font2">清空购物车</font>&nbsp;&nbsp;&nbsp;
  61. <input type="submit" name="redister" value="提交订单" id="submit">
  62. </div>
  63. </div>
  64. <div class="img5">
  65. <img src="img/footer.jpg" id="img5">
  66. </div>
  67. <div class="bottom">
  68. <a href="#" target="_blank"><font color="dodgerblue" size="3px"> 关于我们</font></a>&nbsp;&nbsp;&nbsp;
  69. <a href="#" target="_blank"><font color="dodgerblue" size="3px">联系我们</font></a>&nbsp;&nbsp;&nbsp;
  70. <a href="#" target="_blank"><font color="dodgerblue" size="3px">招贤纳士</font></a>&nbsp;&nbsp;&nbsp;
  71. <a href="#" target="_blank"><font color="dodgerblue" size="3px">法律声明</font></a>&nbsp;&nbsp;&nbsp;
  72. <a href="#" target="_blank"><font color="dodgerblue" size="3px">友情链接</font></a>&nbsp;&nbsp;&nbsp;
  73. <a href="#" target="_blank"><font color="dodgerblue" size="3px">支付方式</font></a>&nbsp;&nbsp;&nbsp;
  74. <a href="#" target="_blank"><font color="dodgerblue" size="3px">配送方式</font></a>&nbsp;&nbsp;&nbsp;
  75. <a href="#" target="_blank"><font color="dodgerblue" size="3px">服务声明</font></a>&nbsp;&nbsp;&nbsp;
  76. <a href="#" target="_blank"><font color="dodgerblue" size="3px">广告声明</font></a>
  77. </div>
  78. <div class="bottom">
  79. <font size="2px">Copyright&copy;2015-2016西部开源&nbsp;版权所有</font>
  80. </div>
  81. </div>
  82. </body>
复制代码



回复

使用道具 举报