用前端知识做一个小项目——购物车

本文链接：https://blog.youkuaiyun.com/yeping_Jun/article/details/120962592

所用技术：html，css,javascript

实现效果：

基本思路：

1.将页面的每个部分都用div盒子装起来，整个页面用一个div盒子，里面再划分多个盒子。

2.添加css样式，使页面基本达到效果。

3.添加js代码，增加一些加减数量，全选，结算的功能。

效果实现：

一.将页面的每个部分都用div盒子装起来，整个页面用一个div盒子，里面再划分多个盒子，大概如此

画了其中一部分，每个方框都是一个div。

<body>
    <!--购物车-->
    <div class="shops">
        <!--店铺-->
        <div class="shop" id="s1">
            <!-- 头-->
            <div class="header">
                <input type="checkbox" class="shop_checkbox" value="2" onclick="midCheck(this)" id="head_check1">
                <input type="hidden" value="shop1_item1_checkbox shop1_item2_checkbox">
                <span class="shop_icon"><img src="img/biilbili.png" class="shop_icon"></span>
                <span class="shop_name">店铺：bilibili旗舰店</span>
                <span class="shop_wangwang_icon"><img src="img/旺旺.png" class="shop_wangwang_icon"></span>
            </div>
            <!--条目1-->
            <div class="item" id="i1">
                <!--复选框-->
                <div class="item_c