css+html+js做一个简单大气的购物车网页
整体运行效果是这样的: 下面展示html部分的代码:
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>华为购物车</title> <link rel="stylesheet" href="css/cart.css"> </head> <body> <div class="float-box"> <div class="confirm-box"> <h4 class="confirm-title"> <span></span> <i class="close-btn"> <span class="line-left"></span> <span class="line-right"></span> </i> </h4> <div class="confirm-content"> 请选择您要删除的商品? </div> <div class="confirm-btn"> <a href="javascript:;" class="delete">删除</a> <a href="javascript:;" class="cancel">取消</a> </div> </div> </div> <div class="header"> <div class="header-center"> </div> </div> <div class="mz-foot"></div> <script src="js/jquery.min.js"></script> <script src="js/cart.js"></script> </body> </html>
由于不能上传文件,只能上传到百度云供大家下载:
百度云下载链接: 提取码:9fa6
该文件由三部分构成,如果要更改内容可用web编辑器打开cart.js,直接在里面更改就行了,可实现价格计算、删除商品,全选等功能。