vue实现自适应购物车勾选数量选择删除总价计算等效果代码
代码语言：html
所属分类：电商
代码描述：vue实现购物车勾选数量选择删除总价计算等效果代码
代码标签： 适应 购物车 勾选 数量 选择 删除 总价 计算 等 效果
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue的购物车实例</title>
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<style>
/* base */
*,
*::before,
*::after {
box-sizing: border-box;
}
html,
body {
overflow-x: hidden;
}
html {
font-family: sans-serif;
font-size: 100%;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
padding: 0;
}
ul, ol {
list-style: none;
margin: 0;
padding: 0;
}
div, p, dl, dt, dd {
margin: 0;
padding: 0;
}
li,
dl,
dt,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hgroup,
p,
blockquote,
figure,
form,
fieldset,
input,
legend,
pre,
abbr,
button {
margin: 0;
padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: normal;
}
pre,
code,
address,
caption,
th,
figcaption {
font-size: 1em;
font-weight: normal;
font-style: normal;
}
fieldset,
iframe,
img {
border: 0;
}
caption,
th {
text-align: left;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
article,
aside,
footer,
header,
nav,
main,
section,
summary,
details,
figure,
figcaption {
display: block;
}
audio,
canvas,
video,
progress {
display: inline-block;
vertical-align: baseline;
}
button {
background: none;
border: 0;
box-sizing: border-box;
color: inherit;
cursor: pointer;
font: inherit;
line-height: inherit;
overflow: visible;
vertical-align: inherit;
}
button:disabled {
cursor: default;
}
a {
color: inherit;
text-decoration: none;
}
a:active,
a:hover {
outline: 0;
}
h1 {
font-size: 2em;
}
img {
border: 0;
}
[hidden] {
display: none;
}
.nobr {
white-space: nowrap;
}
i,
em,
code {
font-style: normal;
}
b,
strong {
font-weight: bold;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
button,
input,
select,
textarea {
font-family: inherit;
/* 1 */
font-size: 100%;
/* 2 */
margin: 0;
/* 3 */
}
input:focus,
select:focus,
textarea:focus,
button:focus, button:active {
outline: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.clearfix:after {
visibility: hidden;
display: block;
content: " ";
clear: both;
}
.clearfix {
zoom: 1;
}
@media print {
body,
#main,
#content {
color: #000;
}
a,
a:link,
a:visited {
color: #000;
text-decoration: none;
}
}
html {
font-size: 10px;
}
body {
font-size: 1.4rem;
font-family: sans-serif;
color: #333;
font-family: "akkurat", sans-serif;
}
.container {
max-width: 1280px;
margin: 0 auto;
}
@media only screen and (max-width: 1280px) {
.container {
width: 100%;
}
}
.btn {
display: inline-block;
height: 54px;
line-height: 54px;
padding: 0 1.2em;
text-align: center;
font-size: 18px;
font-family: "moderat", sans-serif;
transition: all .3s ease-out;
}
.btn:hover {
background-color: #fff;
color: #e02614;
transition: all .3s ease-out;
}
.btn--orange {
background-color: #EE7A23;
border: 1px #EE7A23 solid;
color: #fff;
}
.btn--orange:hover {
background-color: #fff;
color: #EE7A23;
}
.btn--white {
background-color: #fff;
border: 1px #d1434a solid;
color: #d1434a;
}
.btn--white:hover {
background-color: #d1434a;
color: #fff;
}
.btn--red {
background-color: #d1434a;
border: 1px #d1434a solid;
color: #fff;
}
.btn--red:hover {
background-color: #fff;
color: #d1434a;
}
.btn--gray-white {
background-color: none;
border: 1px #605F5F solid;
color: #605F5F;
}
.btn--gray-white:hover {
background-color: #605F5F;
color: #fff;
}
.btn--dis {
background-color: #ccc;
border: 1px #ccc solid;
color: #fff;
cursor: disabled;
}
.btn--dis:hover {
background-color: #ccc;
color: #fff;
}
input[type="text"], textarea {
padding: .5em 20px;
border: 1px solid #e9e9e9;
background: #white;
}
.up-down-btn {
color: #EE7A23;
}
.i-up-down {
position: relative;
display: inline-block;
width: 14px;
height: 6px;
vertical-align: middle;
z-index: 2;
-ms-transform: translateY(2px);
transform: translateY(2px);
transition: transform .3s ease-out;
}
.i-up-down i {
position: absolute;
top: 0;
width: 8px;
height: 1px;
background: #EE7A23;
}
.i-up-down .i-up-down-l {
left: 0;
-ms-transform: rotate(40deg);
transform: rotate(40deg);
transition: transform .3s ease-out;
}
.i-up-down .i-up-down-r {
right: 0;
-ms-transform: rotate(-40deg);
transform: rotate(-40deg);
transition: all .3s ease-out;
}
.select-self {
position: relative;
display: inline-block;
cursor: pointer;
}
.select-self-area {
width: auto;
background: #f0f0f0;
border-radius: 3px;
min-width: 50px;
max-width: 240px;
height: 30px;
line-height: 30px;
}
.select-self-area .select-ipt {
display: block;
height: 100%;
padding: 0 2em 0 1em;
border: 0;
color: #605F5F;
overflow: hidden;
}
.select-self-area .select-btn {
position: absolute;
right: 0;
top: 0;
width: 1.286em;
height: 100%;
background: #fff;
border: 1px solid #ccc;
border-radius: 3px;
text-align: center;
}
.select-self-area .select-btn .i-up-down {
width: 8px;
top: 0;
left: 0;
}
.select-self-area .select-btn .i-up-down i {
width: 5px;
height: 2px;
background-color: #605F5F;
}
.select-self-white .select-self-area {
background: #fff;
border: 1px solid #ccc;
border-radius: 0;
}
.select-self-white .select-btn {
border: none;
background: none;
}
.select-options {
display: none;
position: absolute;
top: 30px;
left: 0;
width: 100%;
max-height: 210px;
background: #f0f0f0;
border-radius: 0 0 3px 3px;
overflow-y: auto;
z-index: 1;
}
.select-options li {
padding: .5em 15px;
border-top: 1px solid #e9e9e9;
text-align: left;
}
.select-options li:hover {
color: #EE7A23;
}
.select-self-open {
border-radius: 3px 3px 0 0;
}
.select-self-open .select-options {
display: block;
}
.select-self-open .i-up-down .i-up-down-l {
left: 0;
-ms-transform: rotate(-40deg);
transform: rotate(-40deg);
transition: transform .3s ease-out;
}
.select-self-open .i-up-down .i-up-down-r {
right: 0;
-ms-transform: rotate(40deg);
transform: rotate(40deg);
transition: all .3s ease-out;
}
.select-self-open .select-options {
z-index: 102;
}
.select-self:hover, .up-down-btn:hover, .up-down-btn.open {
transition: all .3s ease-out;
}
.select-self:hover .i-up-down-l, .up-down-btn:hover .i-up-down-l, .up-down-btn.open .i-up-down-l {
-ms-transform: rotate(-40deg);
transform: rotate(-40deg);
transition: all .3s ease-out;
}
.select-self:hover .i-up-down-r, .up-down-btn:hover .i-up-down-r, .up-down-btn.open .i-up-down-r {
-ms-transform: rotate(40deg);
transform: rotate(40deg);
transition: all .3s ease-out;
}
@charset "UTF-8";
.check-step {
padding: 5px 0;
}
.check-step ul {
display: -ms-flexbox;
display: flex;
margin: 25px 0 50px 0;
}
.check-step ul:after {
visibility: hidden;
display: block;
content: " ";
clear: both;
}
.check-step li {
position: relative;
float: left;
-ms-flex: 1;
flex: 1;
width: 25%;
line-height: 1.5em;
padding: 0 1em 1em 1em;
border-bottom: 2px solid #ccc;
color: #999;
font-size: 16px;
text-align: center;
}
.check-step li:after {
position: absolute;
bottom: -7px;
left: 50%;
margin-left: -7px;
content: "";
width: 14px;
height: 14px;
border-radius: 50%;
background: #ccc;
}
.check-step li.cur {
border-color: #EE7A23;
color: #EE7A23;
}
.check-step li.cur:after {
background: #EE7A23;
}
@media only screen and (max-width: 767px) {
.check-step ul {
margin: 10px 0 25px 0;
}
.check-step li {
font-size: 12px;
}
}
.addr-list ul:after {
visibility: hidden;
display: block;
content: " ";
clear: both;
}
.addr-list li {
position: relative;
float: left;
width: 23.5%;
height: 162px;
margin: 10px 2% 10px 0;
padding: 20px 20px 40px 20px;
background: #fff;
border: 2px solid #e9e9e9;
overflow: hidden;
cursor: pointer;
}
.addr-list li dt {
margin-bottom: 10px;
font-size: 18px;
}
.addr-list li dd {
margin-bottom: 6px;
line-height: 20px;
}
.addr-list li .address {
height: 40px;
overflow: hidden;
}
.addr-list li .tel {
color: #605F5F;
}
.addr-list li .addr-opration {
position: absolute;
}
.addr-list li .addr-opration .icon {
width: 100%;
height: 100%;
}
.addr-list li .addr-opration:hover .icon {
fill: #EE7A23;
}
.addr-list li .addr-edit {
display: none;
top: 20px;
right: 20px;
width: 20px;
height: 20px;
}
.addr-list li .addr-del {
display: none;
bottom: 20px;
right: 20px;
width: 20px;
height: 20px;
}
.addr-list li .addr-set-default, .addr-list li .addr-default {
bottom: 20px;
left: 20px;
color: #EE7A23;
}
.addr-list li .addr-set-default {
display: none;
}
.addr-list li:nth-child(4n) {
margin-right: 0;
}
.addr-list li:hover {
border-color: #EE7A23;
}
.addr-list li.addr-new {
color: #333;
text-align: center;
}
.addr-list li.addr-new .add-new-inner {
padding-top: 20px;
}
.addr-list li.addr-new .add-new-inner .icon-add {
display: inline-block;
width: 50px;
height: 50px;
}
.addr-list li.addr-new .add-new-inner .icon-add .icon-add {
width: 50px;
height: 50px;
fill: #605F5F;
}
.addr-list li.addr-new .add-new-inner p {
margin-top: 10px;
}
.addr-list li.check {
border-color: #EE7A23;
border-width: 2px;
}
.addr-list li.check .addr-opration {
display: block;
}
.shipping-addr-more {
margin-top: 10px;
text-align: center;
}
@media only screen and (max-width: 991px) {
.addr-list {
padding: 0 10px;
}
.addr-list li {
width: 49%;
margin-right: 2%;
}
.addr-list li:nth-child(4n) {
margin-right: 2%;
}
.addr-list li:nth-child(2n) {
margin-right: 0;
}
}
@media only screen and (max-width: 767px) {
.addr-list {
padding: 0 10px;
}
.addr-list li {
width: 100%;
margin: 5px 0;
}
}
.cart-item {
display: table;
width: 100%;
}
.cart-item-head {
display: table-header-group;
width: 100%;
}
.cart-item-head ul {
display: table-row;
width: 100%;
}
.cart-item-head li {
display: table-cell;
height: 54px;
line-height: 54px;
background: #605F5F;
color: #fff;
font-size: 18px;
text-align: center;
}
.cart-item-head li:nth-child(2), .cart-item-head li:nth-child(3), .cart-item-head li:nth-child(4), .cart-item-head li:nth-child(5) {
width: 12%;
padding: 0 10px;
}
.cart-item-list {
display: table-row-group;
}
.cart-item-list > li {
position: relative;
display: table-row;
padding: 36px 0;
}
.cart-item-list > li > div {
position: relative;
display: table-cell;
text-align: center;
vertical-align: top;
border-bottom: 1px solid #e9e9e9;
}
.cart-item-list > li.disabled > div:after {
position: absolute;
top: 0;
left: 0;
content: "";
width: 100%;
height: 100%;
background: rgba(96, 95, 95, 0.3);
z-index: 5;
}
.cart-item-list .cart-tab-1 {
min-height: 72px;
padding: 36px 0;
text-align: left;
border-left: 1px solid #e9e9e9;
}
.cart-item-list .cart-tab-2 {
padding-top: 64px;
}
.cart-item-list .cart-tab-3 {
padding-top: 48px;
}
.cart-item-list .cart-tab-4 {
padding-top: 64px;
}
.cart-item-list .cart-tab-5 {
padding-top: 62px;
border-right: 1px solid #e9e9e9;
}
.cart-item-list .cart-item-check {
float: left;
padding: 28px 0 28px 22px;
}
.cart-item-list .cart-item-pic {
float: left;
width: 80px;
height: 72px;
margin-left: 22px;
border: 1px solid #e9e9e9;
}
.cart-item-list .cart-item-pic img {
width: 100%;
height: 100%;
}
.cart-item-list .cart-item-title {
min-height: 58px;
padding: 0 20px 0 160px;
}
.cart-item-list .cart-item-title .item-name {
margin: 2px 0 10px;
line-height: 16px;
color: #000;
}
.cart-item-list .cart-item-title .item-count-down .icon-clock {
width: 14px;
height: 14px;
fill: #605F5F;
vertical-align: middle;
}
.cart-item-list .cart-item-title .item-count-down .item-count-down-time {
display: inline-block;
height: 14px;
line-height: 14px;
padding: 0 5px;
background: #f0f0f0;
font-size: 12px;
color: #605F5F;
}
.cart-item-list .item-include {
position: relative;
padding-left: 160px;
}
.cart-item-list .item-include dl {
padding-right: 60px;
}
.cart-item-list .item-include dl dt {
float: left;
width: 65px;
}
.cart-item-list .item-include dl dd {
margin-bottom: 13px;
padding-left: 65px;
color: #999;
}
.cart-item-list .item-include dl:after {
visibility: hidden;
display: block;
content: " ";
clear: both;
}
.cart-item-list .item-include .item-include-more {
position: absolute;
right: 10px;
top: 0;
}
.cart-item-list .item-stock {
margin-top: 5px;
font-size: 12px;
color: #999;
}
.cart-item-list .item-stock-no {
color: #d1434a;
}
.cart-item-list .item-price-total {
color: #d1434a;
}
.item-check-btn {
display: inline-block;
width: 16px;
height: 16px;
border: 1px solid #ccc;
border-radius: 50%;
text-align: center;
vertical-align: middle;
cursor: pointer;
}
.item-check-btn .icon-ok {
display: none;
width: 100%;
height: 100%;
fill: #fff;
-ms-transform: scale(0.8);
transform: scale(0.8);
}
.item-check-btn.check {
background: #EE7A23;
border-color: #EE7A23;
}
.item-check-btn.check .icon-ok {
display: inline-block;
}
.item-edit-btn {
display: inline-block;
width: 16px;
height: 20px;
}
.item-edit-btn .icon-del {
width: 100%;
height: 100%;
fill: #999;
}
.order-item .cart-item-list .cart-item-title, .order-item .cart-item-list .item-include {
padding-left: 122px;
}
.order-item .select-self-area .select-ipt {
padding: 0;
text-align: center;
}
@media only screen and (max-width: 991px) {
.cart-item {
display: block;
background: #f0f0f0;
}
.cart-item-head {
display: none;
}
.cart-item-list {
display: block;
}
.cart-item-list > li {
position: relative;
display: block;
margin-bottom: 10px;
padding: 0;
background: #fff;
border-top: 1px solid #e9e9e9;
border-bottom: 1px solid #e9e9e9;
}
.cart-item-list > li > div {
position: static;
display: block;
border: none;
}
.cart-item-list > li.disabled:after {
position: absolute;
top: 0;
left: 0;
content: "";
width: 100%;
height: 100%;
background: rgba(96, 95, 95, 0.3);
z-index: 5;
}
.cart-item-list > li.disabled > div:after {
display: none;
}
.cart-item-list .cart-tab-1 {
padding: 18px 0 0 0;
border: none;
}
.cart-item-list .cart-tab-2 {
display: none;
}
.cart-item-list .cart-tab-3 {
float: left;
width: 50%;
padding: 8px 0 8px 10px;
text-align: left;
}
.cart-item-list .cart-tab-4 {
float: right;
width: 50%;
padding: 15px 10px 14px 0;
text-align: right;
}
.cart-item-list .cart-tab-5 {
clear: both;
padding: 0;
}
.cart-item-list .cart-item-check {
padding-left: 10px;
}
.cart-item-list .cart-item-pic {
margin-left: 10px;
}
.cart-item-list .cart-item-title {
height: 72px;
padding: 0 10px 0 126px;
}
.cart-item-list .item-include {
clear: both;
margin-top: 10px;
padding: 0 10px 0 36px;
border-bottom: 1px solid #e9e9e9;
}
.cart-item-list .item-quantity > div {
display: inline-block;
margin-right: 3px;
vertical-align: middle;
}
.cart-item-list .item-stock {
margin-top: 0;
}
.cart-item-list .cart-item-opration {
position: absolute;
top: 60px;
right: 10px;
}
.order-item .cart-item-list .cart-item-title {
padding-left: 100px;
}
.order-item .cart-item-list .item-include {
padding-left: 10px;
}
}
.shipping-method {
text-align: center;
}
.shipping-method li {
display: inline-block;
width: 300px;
margin: 5px;
padding: 10px;
background: #fff;
border: 2px solid #e9e9e9;
font-size: 18px;
line-height: 26px;
text-align: center;
color: #999;
font-family: "Moderat";
cursor: pointer;
}
.shipping-method li .price {
font-weight: bold;
}
.shipping-method li.check {
border-color: #EE7A23;
color: #333;
}
.shipping-method li:hover {
border-color: #EE7A23;
}
@media only screen and (max-width: 767px) {
.shipping-method {
padding: 10px;
}
.shipping-method li {
width: 100%;
margin: 5px 0;
}
}
.apply-promotion {
font-size: 0;
text-align: center;
background: #fff;
}
.apply-promotion li {
display: inline-block;
font-size: 14px;
width: 25%;
min-height: 114px;
vertical-align: top;
}
.apply-promotion li p {
margin-top: 12px;
font-size: 18px;
}
.apply-promotion .type i {
display: inline-block;
width: 60px;
height: 60px;
background: url(../../img/icon_sprite@2x.png) no-repeat 0 0;
background-size: 128px 122px;
}
.apply-promotion .type.type-cash i {
background-position: -68px 0;
}
.apply-promotion .type.type-sale i {
width: 66px;
}
.apply-promotion .type.type-off i {
background-position: 0 -62px;
}
@media only screen and (max-width: 767px) {
.apply-promotion li {
border-right: 1px solid #e9e9e9;
}
.apply-promotion li:last-child, .apply-promotion li:nth-child(4n) {
border-right: none;
}
.apply-promotion li .type {
-ms-transform: scale(0.66);
transform: scale(0.66);
}
}
.price-count ul {
display: table;
width: 100%;
}
.price-count li {
display: table-row;
font-size: 18px;
}
.price-count li span {
display: table-cell;
height: 36px;
padding-right: 10px;
vertical-align: top;
text-align: right;
}
.price-count li span:first-child {
color: #999;
}
.price-count li span:last-child {
width: 110px;
}
.price-count .order-total-price span:last-child {
color: #d1434a;
}
.tips_pop {
position: relative;
}
.tips_pop .i_info {
display: inline-block;
width: 12px;
height: 12px;
background: url(../../img/info.png) no-repeat 0 0;
background-size: 100% auto;
border-radius: 50%;
}
.tips_pop .tips_pop_box {
position: absolute;
bottom: 28px;
left: -250px;
display: none;
width: 274px;
padding: 20px 10px;
background: #fff;
border: 1px solid #e9e9e9;
border-radius: 5px;
}
.tips_pop .i_down {
position: absolute;
bottom: -6px;
left: 250px;
display: inline-block;
width: 10px;
height: 10px;
border-right: 1px solid #e9e9e9;
border-bottom: 1px solid #e9e9e9;
background: #fff;
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.tips_pop:hover .tips_pop_box {
display: block;
}
.tee_tips_pop {
display: inline-block;
margin-right: 44px;
font-size: 14px;
text-align: left;
}
.tee_tips_pop dt {
margin-bottom: 10px;
color: #333;
}
.tee_tips_pop .tee_pop_box em {
display: inline-block;
width: 190px;
vertical-align: top;
}
.tee_tips_pop .tee_pop_box .price {
width: 50px;
text-align: right;
}
.tee_tips_pop .tee_pop_box .tee_total {
margin-top: 13px;
padding-top: 13px;
border-top: 1px solid #f0f0f0;
}
.tee_tips_pop .tee_pop_box .tee_total em {
color: #333;
}
.tee_tips_pop .tee_pop_box .price {
color: #d1434a;
}
@media only screen and (max-width: 991px) {
.price-count li {
font-size: 16px;
}
.price-count li span {
height: 29px;
}
}
/* 订单成功 */
.order-create {
padding: 30px 0 40px 0;
background: #fff;
text-align: center;
}
.order-create-pic {
width: 288px;
margin: 0 auto;
margin-bottom: 18px;
}
.order-create-pic img {
width: 100%;
}
.order-create-main h3 {
margin-bottom: 18px;
font-size: 32px;
line-height: 1.5em;
}
.order-create-main p {
margin-bottom: 86px;
font-size: 16px;
line-height: 1.5em;
color: #666;
}
.order-create-main .order-create-btn-wrap {
max-width: 460px;
margin: 0 auto;
padding: 0 5px;
}
.order-create-main .order-create-btn-wrap > div {
float: left;
width: 50%;
padding: 0 10px;
}
.order-create-main .order-create-btn-wrap .btn {
width: 100%;
min-width: auto;
}
.order-create-main .order-create-btn-wrap:after {
visibility: hidden;
display: block;
content: " ";
clear: both;
}
.order-create-main .get-lecode {
margin-bottom: 40px;
padding: 0 10px;
}
.order-create-main .get-lecode .lecode-main {
max-width: 767px;
margin: 0 auto 10px auto;
padding: 37px 0;
border: 1px dashed #EE7A23;
}
.order-create-main .get-lecode .lecode-main .lecode-num {
margin-bottom: 20px;
color: #EE7A23;
font-size: 20px;
}
.order-create-main .get-lecode .get-lecode-tips {
color: #999;
line-height: 16px;
line-height: 18px;
}
@media only screen and (max-width: 767px) {
.order-create-pic img {
width: 55.55%;
}
.order-create-main h3 {
margin-bottom: 10px;
font-size: 20px;
}
.order-create-main p {
margin-bottom: 40px;
}
.order-create-main p span {
display: block;
}
.order-create-main .order-create-btn-wrap > div {
padding: 0 5px;
}
.order-create-main .order-create-btn-wrap .btn {
font-size: 16px;
}
.order-create-main .get-lecode .lecode-main {
width: 100%;
}
}
.checkout .btn {
min-width: 220px;
}
.checkout-title {
margin-top: 100px;
position: relative;
margin-bottom: 41px;
text-align: center;
}
.checkout-title span {
position: relative;
padding: 0 1em;
background-color: #fff;
font-family: "moderat", sans-serif;
font-weight: bold;
font-size: 20px;
color: #605F5F;
z-index: 1;
}
.checkout-title:before {
position: absolute;
top: 50%;
left: 0;
content: "";
width: 100%;
height: 1px;
background: #ccc;
z-index: 0;
}
/** 确认地址 **/
.addr-list-wrap {
min-height: 300px;
padding-bottom: 40px;
}
.shipping-method-wrap {
padding-bottom: 65px;
}
.checkout-addr .next-btn-wrap {
padding: 62px 0;
border-top: 1px solid #e9e9e9;
text-align: center;
}
/** cart **/
.cart {
padding: 69px 0 54px 0;
}
.cart-foot-wrap {
height: 54px;
line-height: 54px;
margin-top: 18px;
}
.cart-foot-wrap .cart-foot-l {
float: left;
font-size: 16px;
padding: 0 22px;
}
.cart-foot-wrap .item-all-check {
float: left;
color: #EE7A23;
}
.cart-foot-wrap .item-all-check .item-check-btn {
margin-right: 18px;
}
.cart-foot-wrap .item-all-check span {
vertical-align: middle;
}
.cart-foot-wrap .item-all-del {
float: left;
margin-left: 22px;
}
.cart-foot-wrap .cart-foot-r {
float: right;
}
.cart-foot-wrap .item-total {
float: left;
margin-right: 31px;
color: #605F5F;
font-size: 18px;
}
.cart-foot-wrap .item-total .total-price {
margin-left: 16px;
color: #d1434a;
font-family: "moderat", sans-serif;
}
.cart-foot-wrap .next-btn-wrap {
float: right;
}
.cart-foot-wrap:after {
visibility: hidden;
display: block;
content: " ";
clear: both;
}
/** order confirm **/
.checko.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0