jquery+bootstrap实现购物车增减数量价格变动效果代码-html代码-BFW代码库

jquery+bootstrap实现购物车增减数量价格变动效果代码

代码语言：html

所属分类：其他

代码描述：jquery+bootstrap实现购物车增减数量价格变动效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
</head>

<style lang="scss">
    .shopping-car-container {
        padding: 50px 40px;
    }

        .shopping-car-container .car-headers-menu {
            border-bottom: 1px solid #f5f5f5;
            padding: 0 15px;
        }

        .shopping-car-container .panel-body {
            padding: 15px 0;
        }

    #checkAll {
        vertical-align: text-bottom;
    }

    .shopping-car-container .car-menu {
        text-align: center;
    }
    /*
         商品区
         * */

    .shopping-car-container .goods-content {
        margin-top: 15px;
    }

        .shopping-car-container .goods-content .goods-item {
            margin-top: 20px;
        }

            .shopping-car-container .goods-content .goods-item .car-goods-info {
                height: 150px;
                display: flex;
                align-items: center;
                justify-content: center;
                overflow: hidden;
            }

            .shopping-car-container .goods-content .goods-item .goods-image-column img,
            .shopping-car-container .goods-content .goods-item .goods-image-column span {
                display: block;
                float: left;
            }

            .shopping-car-container .goods-content .goods-item .goods-image-column span {
                width: calc(100% - 100px);
                box-sizing: border-box;
                text-indent: 2rem;
                line-height: 25px;
                padding: 10px;
            }

    .goods-price {
        color: red;
        font-weight: bolder;
    }

    .form-control {
        text-align: center;
    }

    .single-total {
        color: red;
        font-weight: bold;
    }

    .goods-params {
        color: darkgray;
    }

    .bottom-menu {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .bottom-menu #checkAllBottom {
            vertical-align: text-bottom;
        }

    #deleteMulty {
        color: cornfl.........完整代码请登录后点击上方下载按钮下载查看