master
chen 2021-09-15 18:10:01 +08:00
commit b6b913db2f
13 changed files with 345 additions and 837 deletions

View File

@ -10,24 +10,13 @@ li {
a { a {
text-decoration: none; text-decoration: none;
} }
/* 背景图 */
header .img {
position: absolute;
left: 20%;
top: 5%;
transform: translate(-20%, -5%);
}
header .img img {
height: 50px;
}
header .bac { header .bac {
height: 930px; height: 930px;
background-size: 100% 100%; background-size: 100% 100%;
background-image: url("../../img/images/backimage.png"); background-image: url("../../img/images/backimage.png");
} }
/* 输入整体框 */
header .container { header .container {
width: 420px; width: 420px;
height: 680px; height: 680px;
@ -62,7 +51,7 @@ header .container .head .gang {
margin: auto; margin: auto;
border-bottom: 1px solid #cb1919; border-bottom: 1px solid #cb1919;
} }
/* 身份访问 */
header .container .identity ul { header .container .identity ul {
margin: 20px; margin: 20px;
padding-bottom: 20px; padding-bottom: 20px;
@ -116,10 +105,18 @@ header .container .identity ul li .Vbtn-2:hover:after {
width: 70%; width: 70%;
} }
header .container .identity ul li:visited { /* 点击切换会员 */
color: #000; header .container .identity ul li .member:link{
color: #737373;
}
header .container .identity ul li .member:hover{
color: #737373;
}
header .container .identity ul li .member:visited:focus{
color: #333;
} }
/* 输入框 */
header .container .layui-input { header .container .layui-input {
border-radius: 5px; border-radius: 5px;
width: 400px; width: 400px;
@ -132,7 +129,7 @@ header .container .layui-input {
header .container .layui-form-item { header .container .layui-form-item {
margin-left: -30px; margin-left: -30px;
} }
/* 用户协议 */
header .container .layui-form-item .checkb { header .container .layui-form-item .checkb {
margin-left: 30px; margin-left: 30px;
} }
@ -155,7 +152,7 @@ header .container .layui-form-item .font-set {
header .container .layui-input-block:last-child { header .container .layui-input-block:last-child {
margin-left: 20px; margin-left: 20px;
} }
/* 验证码 */
header .container .codes { header .container .codes {
display: inline-flex; display: inline-flex;
} }
@ -191,22 +188,11 @@ header .container .layui-btn {
header .container .verity { header .container .verity {
width: 200px; width: 200px;
} }
/* 登录 */
header .container .bot { header .container .bot {
text-align: center; text-align: center;
} }
header .container #verify {
height: 34px;
vertical-align: top;
font-size: 16px;
}
header .container #verify #code_img {
width: 100px;
height: 40px;
cursor: pointer;
vertical-align: top;
}

View File

@ -11,16 +11,16 @@ a {
text-decoration: none; text-decoration: none;
} }
/* 背景图 */
header .bac { header .bac {
height: 930px; height: 930px;
background-size: 100% 100%; background-size: 100% 100%;
background-image: url("../../img/images/backimage.png"); background-image: url("../../img/images/backimage.png");
} }
/* 输入整体框 */
header .container { header .container {
width: 420px; width: 420px;
height: 450px; height: 400px;
min-height: 320px; min-height: 320px;
max-height: 570px; max-height: 570px;
position: absolute; position: absolute;
@ -52,7 +52,7 @@ header .container .head .gang {
margin: auto; margin: auto;
border-bottom: 1px solid #cb1919; border-bottom: 1px solid #cb1919;
} }
/* 身份访问 */
header .container .identity ul { header .container .identity ul {
margin: 20px; margin: 20px;
padding-bottom: 20px; padding-bottom: 20px;
@ -71,7 +71,7 @@ header .container .identity ul li a {
} }
header .container .identity ul li .set_1_btn { header .container .identity ul li .set_1_btn {
color: #333; color: #737373;
display: block; display: block;
font-weight: 400; font-weight: 400;
line-height: 45px; line-height: 45px;
@ -80,7 +80,7 @@ header .container .identity ul li .set_1_btn {
text-decoration: none; text-decoration: none;
width: 100%; width: 100%;
} }
/* 会员底部展示条 */
header .container .identity ul li .Vbtn-2 { header .container .identity ul li .Vbtn-2 {
letter-spacing: 0; letter-spacing: 0;
transition: all 150ms linear 0s; transition: all 150ms linear 0s;
@ -100,16 +100,21 @@ header .container .identity ul li .Vbtn-2:after {
header .container .identity ul li .Vbtn-2:hover:after { header .container .identity ul li .Vbtn-2:hover:after {
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
backface-visibility: hidden; backface-visibility: hidden;
border-color: #56c5ff;
-webkit-transition: width 350ms ease-in-out; -webkit-transition: width 350ms ease-in-out;
transition: width 350ms ease-in-out; transition: width 350ms ease-in-out;
width: 70%; width: 70%;
} }
/* 点击切换会员 */
header .container .identity ul li:visited { header .container .identity ul li .member:link{
color: #000; color: #737373;
} }
header .container .identity ul li .member:hover{
color: #737377;
}
header .container .identity ul li .member:visited:focus{
color: #333;
}
/* 输入框 */
header .container .layui-input { header .container .layui-input {
border-radius: 5px; border-radius: 5px;
width: 400px; width: 400px;
@ -123,20 +128,6 @@ header .container .layui-form-item {
margin-left: -30px; margin-left: -30px;
} }
header .container .layui-form-item .checkb {
margin-left: 30px;
}
header .container .layui-form-item .checkb input {
display: block;
position: relative;
top: 19px;
}
header .container .layui-form-item .checkb a {
color: #cb1919;
}
header .container .layui-form-item .font-set { header .container .layui-form-item .font-set {
font-size: 13px; font-size: 13px;
text-decoration: none; text-decoration: none;
@ -146,30 +137,6 @@ header .container .layui-input-block:last-child {
margin-left: 20px; margin-left: 20px;
} }
header .container .codes {
display: inline-flex;
}
header .container .codes input {
margin-top: 0;
}
header .container .codes li {
width: 200px;
height: 40px;
background: #efefef;
border-radius: 5px;
}
header .container .codes li p {
color: #8c8c8c;
z-index: 3;
text-align: center;
font-size: 14px;
margin-top: 10px;
z-index: 3;
}
header .container .layui-btn { header .container .layui-btn {
margin-left: 18px; margin-left: 18px;
border-radius: 5px; border-radius: 5px;
@ -178,11 +145,7 @@ header .container .layui-btn {
font-size: 15px; font-size: 15px;
background-color: #cb1919; background-color: #cb1919;
} }
/* 忘记密码 */
header .container .verity {
width: 200px;
}
header .container .bot a:first-child { header .container .bot a:first-child {
float: left; float: left;
} }
@ -190,150 +153,3 @@ header .container .bot a:first-child {
header .container .bot a:last-child { header .container .bot a:last-child {
float: right; float: right;
} }
section {
background-color: #cb1919;
height: 60px;
padding: 0px 180px;
}
section .navig {
width: 100%;
}
section .navig .label .label-text ul {
display: flex;
float: left;
}
section .navig .label .label-text ul li {
padding: 20px 21px;
}
section .navig .label .label-text ul li a {
color: #fff;
}
section .navig .label .label-icon {
background-color: #cb1919;
}
section .navig .label .label-icon ul {
display: flex;
float: right;
}
section .navig .label .label-icon ul li {
padding: 20px 21px;
}
section .navig .label .label-icon ul li img {
width: 25px;
}
footer {
padding: 0px 180px;
}
footer .foot {
display: flex;
margin: 0 auto;
}
footer .intr {
padding: 35px;
width: 342px;
height: 226px;
}
footer .intr img {
height: 86px;
margin-bottom: 30px;
}
footer .intr p:nth-child(1) {
font-size: 40px;
}
footer .intr p:nth-child(2) {
color: #616161;
}
footer .address {
background-color: #faf9f8;
border-left: 1px solid #ededed;
border-bottom: 1px solid #ededed;
}
footer .address .addreses {
display: flex;
}
footer .address .addreses .addres-1, footer .address .addreses .addres-2, footer .address .addreses .addres-3 {
padding: 33px;
}
footer .address .addreses .icp {
padding: 28px 40px;
border-top: 1px solid #ededed;
}
footer .address .addreses .addres-1 {
width: 310px;
}
footer .address .addreses .addres-1 img {
height: 50px;
margin-bottom: 40px;
}
footer .address .addreses .addres-1 p {
line-height: 25px;
}
footer .address .addreses .addres-1 p:nth-of-type(1) {
font-weight: 700;
}
footer .address .addreses .addres-1 p:nth-of-type(2) {
font-size: 6px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-2 {
font-size: 20px;
font-weight: 700;
color: #000;
}
footer .address .addreses .addres-2 p {
line-height: 25px;
}
footer .address .addreses .addres-2 p:nth-of-type(1) {
font-weight: 700;
}
footer .address .addreses .addres-2 p:nth-of-type(2) {
font-size: 12.5px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-3 {
display: flex;
}
footer .address .addreses .addres-3 img {
height: 92px;
}
footer .address .addreses .addres-3 p {
float: left;
font-size: 1px;
margin-left: 12px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-4 {
padding: 63px;
}

View File

@ -10,13 +10,13 @@ li {
a { a {
text-decoration: none; text-decoration: none;
} }
/* 背景图 */
header .bac { header .bac {
height: 930px; height: 930px;
background-size: 100% 100%; background-size: 100% 100%;
background-image: url("../../img/images/backimage.png"); background-image: url("../../img/images/backimage.png");
} }
/* 输入整体框 */
header .container { header .container {
width: 420px; width: 420px;
height: 680px; height: 680px;
@ -51,7 +51,7 @@ header .container .head .gang {
margin: auto; margin: auto;
border-bottom: 1px solid #cb1919; border-bottom: 1px solid #cb1919;
} }
/* 身份访问 */
header .container .identity ul { header .container .identity ul {
margin: 20px; margin: 20px;
padding-bottom: 20px; padding-bottom: 20px;
@ -79,7 +79,7 @@ header .container .identity ul li .set_1_btn {
text-decoration: none; text-decoration: none;
width: 100%; width: 100%;
} }
/* 会员底部展示条 */
header .container .identity ul li .Vbtn-2 { header .container .identity ul li .Vbtn-2 {
letter-spacing: 0; letter-spacing: 0;
transition: all 150ms linear 0s; transition: all 150ms linear 0s;
@ -105,10 +105,17 @@ header .container .identity ul li .Vbtn-2:hover:after {
width: 70%; width: 70%;
} }
header .container .identity ul li:visited { /* 点击切换会员 */
color: #000; header .container .identity ul li .member:link{
color: #737373;
} }
header .container .identity ul li .member:hover{
color: #737373;
}
header .container .identity ul li .member:visited:focus{
color: #333;
}
/* 输入框 */
header .container .layui-input { header .container .layui-input {
border-radius: 5px; border-radius: 5px;
width: 400px; width: 400px;
@ -203,146 +210,3 @@ section {
height: 60px; height: 60px;
padding: 0px 180px; padding: 0px 180px;
} }
section .navig {
width: 100%;
}
section .navig .label .label-text ul {
display: flex;
float: left;
}
section .navig .label .label-text ul li {
padding: 20px 21px;
}
section .navig .label .label-text ul li a {
color: #fff;
}
section .navig .label .label-icon {
background-color: #cb1919;
}
section .navig .label .label-icon ul {
display: flex;
float: right;
}
section .navig .label .label-icon ul li {
padding: 20px 21px;
}
section .navig .label .label-icon ul li img {
width: 25px;
}
footer {
padding: 0px 180px;
}
footer .foot {
display: flex;
margin: 0 auto;
}
footer .intr {
padding: 35px;
width: 342px;
height: 226px;
}
footer .intr img {
height: 86px;
margin-bottom: 30px;
}
footer .intr p:nth-child(1) {
font-size: 40px;
}
footer .intr p:nth-child(2) {
color: #616161;
}
footer .address {
background-color: #faf9f8;
border-left: 1px solid #ededed;
border-bottom: 1px solid #ededed;
}
footer .address .addreses {
display: flex;
}
footer .address .addreses .addres-1,
footer .address .addreses .addres-2,
footer .address .addreses .addres-3 {
padding: 33px;
}
footer .address .addreses .icp {
padding: 28px 40px;
border-top: 1px solid #ededed;
}
footer .address .addreses .addres-1 {
width: 310px;
}
footer .address .addreses .addres-1 img {
height: 50px;
margin-bottom: 40px;
}
footer .address .addreses .addres-1 p {
line-height: 25px;
}
footer .address .addreses .addres-1 p:nth-of-type(1) {
font-weight: 700;
}
footer .address .addreses .addres-1 p:nth-of-type(2) {
font-size: 6px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-2 {
font-size: 20px;
font-weight: 700;
color: #000;
}
footer .address .addreses .addres-2 p {
line-height: 25px;
}
footer .address .addreses .addres-2 p:nth-of-type(1) {
font-weight: 700;
}
footer .address .addreses .addres-2 p:nth-of-type(2) {
font-size: 12.5px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-3 {
display: flex;
}
footer .address .addreses .addres-3 img {
height: 92px;
}
footer .address .addreses .addres-3 p {
float: left;
font-size: 1px;
margin-left: 12px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-4 {
padding: 63px;
}

View File

@ -11,13 +11,13 @@ a {
text-decoration: none; text-decoration: none;
} }
/* 背景图 */
header .bac { header .bac {
height: 930px; height: 930px;
background-size: 100% 100%; background-size: 100% 100%;
background-image: url("../../img/images/backimage.png"); background-image: url("../../img/images/backimage.png");
} }
/* 输入整体框 */
header .container { header .container {
width: 420px; width: 420px;
height: 570px; height: 570px;
@ -52,7 +52,7 @@ header .container .head .gang {
margin: auto; margin: auto;
border-bottom: 1px solid #cb1919; border-bottom: 1px solid #cb1919;
} }
/* 身份访问 */
header .container .identity ul { header .container .identity ul {
margin: 20px; margin: 20px;
padding-bottom: 20px; padding-bottom: 20px;
@ -70,8 +70,8 @@ header .container .identity ul li a {
color: #737373; color: #737373;
} }
header .container .identity ul li .set_1_btn { header .container .identity ul li .set_1_btn:link {
color: #333; color: #737373;
display: block; display: block;
font-weight: 400; font-weight: 400;
line-height: 45px; line-height: 45px;
@ -80,7 +80,13 @@ header .container .identity ul li .set_1_btn {
text-decoration: none; text-decoration: none;
width: 100%; width: 100%;
} }
header .container .identity ul li .set_1_btn:hover {
color: #333;
}
header .container .identity ul li .set_1_btn:active:visited:focus {
color: #000;
}
/* 会员底部显示条 */
header .container .identity ul li .Vbtn-2 { header .container .identity ul li .Vbtn-2 {
letter-spacing: 0; letter-spacing: 0;
transition: all 150ms linear 0s; transition: all 150ms linear 0s;
@ -100,7 +106,6 @@ header .container .identity ul li .Vbtn-2:after {
header .container .identity ul li .Vbtn-2:hover:after { header .container .identity ul li .Vbtn-2:hover:after {
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
backface-visibility: hidden; backface-visibility: hidden;
border-color: #56c5ff;
-webkit-transition: width 350ms ease-in-out; -webkit-transition: width 350ms ease-in-out;
transition: width 350ms ease-in-out; transition: width 350ms ease-in-out;
width: 70%; width: 70%;
@ -109,7 +114,17 @@ header .container .identity ul li .Vbtn-2:hover:after {
header .container .identity ul li:visited { header .container .identity ul li:visited {
color: #000; color: #000;
} }
/* 点击切换会员 */
header .container .identity ul li .member:link{
color: #737373;
}
header .container .identity ul li .member:hover{
color: #737373;
}
header .container .identity ul li .member:visited:focus{
color: #333;
}
/* 输入框 */
header .container .layui-input { header .container .layui-input {
border-radius: 5px; border-radius: 5px;
width: 400px; width: 400px;
@ -122,7 +137,7 @@ header .container .layui-input {
header .container .layui-form-item { header .container .layui-form-item {
margin-left: -30px; margin-left: -30px;
} }
/* 用户协议 */
header .container .layui-form-item .checkb { header .container .layui-form-item .checkb {
margin-left: 30px; margin-left: 30px;
} }
@ -169,6 +184,7 @@ header .container .codes li p {
z-index: 3; z-index: 3;
} }
/* 登录 */
header .container .layui-btn { header .container .layui-btn {
margin-left: 18px; margin-left: 18px;
border-radius: 5px; border-radius: 5px;
@ -186,162 +202,5 @@ header .container .bot {
text-align: center; text-align: center;
} }
header .container #verify {
height: 34px;
vertical-align: top;
font-size: 16px;
}
header .container #verify #code_img {
width: 100px;
height: 40px;
cursor: pointer;
vertical-align: top;
}
section {
background-color: #cb1919;
height: 60px;
padding: 0px 180px;
}
section .navig {
width: 100%;
}
section .navig .label .label-text ul {
display: flex;
float: left;
}
section .navig .label .label-text ul li {
padding: 20px 21px;
}
section .navig .label .label-text ul li a {
color: #fff;
}
section .navig .label .label-icon {
background-color: #cb1919;
}
section .navig .label .label-icon ul {
display: flex;
float: right;
}
section .navig .label .label-icon ul li {
padding: 20px 21px;
}
section .navig .label .label-icon ul li img {
width: 25px;
}
footer {
padding: 0px 180px;
}
footer .foot {
display: flex;
margin: 0 auto;
}
footer .intr {
padding: 35px;
width: 342px;
height: 226px;
}
footer .intr img {
height: 86px;
margin-bottom: 30px;
}
footer .intr p:nth-child(1) {
font-size: 40px;
}
footer .intr p:nth-child(2) {
color: #616161;
}
footer .address {
background-color: #faf9f8;
border-left: 1px solid #ededed;
border-bottom: 1px solid #ededed;
}
footer .address .addreses {
display: flex;
}
footer .address .addreses .addres-1, footer .address .addreses .addres-2, footer .address .addreses .addres-3 {
padding: 33px;
}
footer .address .addreses .icp {
padding: 28px 40px;
border-top: 1px solid #ededed;
}
footer .address .addreses .addres-1 {
width: 310px;
}
footer .address .addreses .addres-1 img {
height: 50px;
margin-bottom: 40px;
}
footer .address .addreses .addres-1 p {
line-height: 25px;
}
footer .address .addreses .addres-1 p:nth-of-type(1) {
font-weight: 700;
}
footer .address .addreses .addres-1 p:nth-of-type(2) {
font-size: 6px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-2 {
font-size: 20px;
font-weight: 700;
color: #000;
}
footer .address .addreses .addres-2 p {
line-height: 25px;
}
footer .address .addreses .addres-2 p:nth-of-type(1) {
font-weight: 700;
}
footer .address .addreses .addres-2 p:nth-of-type(2) {
font-size: 12.5px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-3 {
display: flex;
}
footer .address .addreses .addres-3 img {
height: 92px;
}
footer .address .addreses .addres-3 p {
float: left;
font-size: 1px;
margin-left: 12px;
color: rgba(97, 97, 97, 0.8);
}
footer .address .addreses .addres-4 {
padding: 63px;
}

View File

@ -37,7 +37,7 @@ header .container {
box-shadow: 0 3px 18px rgba(100, 0, 0, 0.5); box-shadow: 0 3px 18px rgba(100, 0, 0, 0.5);
font-size: 16px; font-size: 16px;
} }
/* 输入框 */
header .container .head { header .container .head {
text-align: center; text-align: center;
line-height: 40px; line-height: 40px;

View File

@ -18,7 +18,7 @@ section {
} }
section .whoil { section .whoil {
padding: 15px 50px; padding: 15px 240px;
} }
section .whoil .whoil-1 { section .whoil .whoil-1 {
@ -40,7 +40,7 @@ section .whoil .whoil-1 .all h2 {
background-color: #fff; background-color: #fff;
border-bottom: #cb1919 2px solid; border-bottom: #cb1919 2px solid;
} }
/* 选择 */
section .whoil .whoil-1 table { section .whoil .whoil-1 table {
width: 100%; width: 100%;
border: 1; border: 1;
@ -48,14 +48,20 @@ section .whoil .whoil-1 table {
border-spacing: 0px 20px; border-spacing: 0px 20px;
background-color: #fff; background-color: #fff;
} }
/* 全选 */
section .whoil .whoil-1 table thead { section .whoil .whoil-1 table thead {
width: 100%; width: 100%;
background-color: #f3f3f3; background-color: #f3f3f3;
border: 2px solid #000; border: 2px solid #000;
margin-bottom: 20px; margin-bottom: 20px;
} }
/* 全选 */
section .whoil .whoil-1 tfoot {
width: 100%;
background-color: #f3f3f3;
border: 2px solid #000;
margin-bottom: 20px;
}
section .whoil .whoil-1 table thead th { section .whoil .whoil-1 table thead th {
padding: 10px 20px; padding: 10px 20px;
} }
@ -63,6 +69,9 @@ section .whoil .whoil-1 table thead th {
section .whoil .whoil-1 table thead th:nth-child(2) { section .whoil .whoil-1 table thead th:nth-child(2) {
float: left; float: left;
} }
section .whoil .whoil-1 table thead th:nth-child(n + 3) {
padding-left: 55px;
}
section .whoil .whoil-1 table thead th input { section .whoil .whoil-1 table thead th input {
float: left; float: left;
@ -74,16 +83,23 @@ section .whoil .whoil-1 table tbody .inline {
section .whoil .whoil-1 table tbody .inline td span { section .whoil .whoil-1 table tbody .inline td span {
display: inline-block; display: inline-block;
margin-left: 10px; margin-left: 15px;
} }
section .whoil .whoil-1 table tbody .inline td:nth-child(1) { section .whoil .whoil-1 table tbody .inline th {
width: 70px; width: 140px;
padding: 0px 10px;
}
section .whoil .whoil-1 table tbody .inline th input {
position: absolute;
margin:16px 18px;
}
section .whoil .whoil-1 table tbody .inline th img {
margin-left: 55px;
} }
section .whoil .whoil-1 table tbody .inline td:nth-child(n + 2) { section .whoil .whoil-1 table tbody .inline td:nth-child(n + 2) {
padding: 10px 20px; padding: 10px 0px;
} }
section .whoil .whoil-1 table tbody .inline td:nth-child(n + 3) { section .whoil .whoil-1 table tbody .inline td:nth-child(n + 3) {
@ -99,31 +115,34 @@ section .whoil .whoil-1 table tbody .inline td:nth-child(4) input {
width: 40px; width: 40px;
text-align: center; text-align: center;
} }
section .whoil .whoil-1 table tbody .inline td:nth-child(4) button {
width:15px;
}
/* 结算 */
section .whoil .whoil-1 table tfoot { section .whoil .whoil-1 table tfoot {
background-color: #f3f3f3; background-color: #f3f3f3;
height: 50px; height: 50px;
} }
section .whoil .whoil-1 table tfoot td:nth-child(1) { section .whoil .whoil-1 table tfoot th {
padding: 10px 20px; padding: 10px 20px;
} }
section .whoil .whoil-1 table tfoot td:nth-child(5) { section .whoil .whoil-1 table tfoot #allPrice {
width: 200px;
}
section .whoil .whoil-1 table tfoot td:nth-child(5) #allPrice {
color: #cb1919; color: #cb1919;
font-size: 30px; font-size: 30px;
font-weight: 800; font-weight: 800;
} }
section .whoil .whoil-1 table tfoot td:nth-child(6) span { section .whoil .whoil-1 table tfoot td:last-child span {
color: #f5f5f5;
background-color: #cb1919; background-color: #cb1919;
padding: 15px 25px; padding: 18px 50px;
} float: right;
}
/* 轮播图 */
section .whoil .whoil-1 .swiper-container { section .whoil .whoil-1 .swiper-container {
width: 100%; width: 100%;
height: 380px; height: 380px;
@ -133,17 +152,27 @@ section .whoil .whoil-1 .swiper-container {
section .whoil .whoil-1 .swiper-container .swiper-text { section .whoil .whoil-1 .swiper-container .swiper-text {
padding: 10px 5px; padding: 10px 5px;
border-bottom: #e0e0e0 1px solid; border-bottom: #e0e0e0 1px solid;
font-size: 20px;
font-weight: 700;
margin-left: 20px;
margin-right: 20px;
} }
section .whoil .whoil-1 .swiper-wrapper { /* section .whoil .whoil-1 .swiper-wrapper {
margin-top: 20px; margin-top: 20px;
} } */
section .whoil .whoil-1 .swiper-container img { section .whoil .whoil-1 .swiper-container img {
display: block; display: block;
/* width: 100%; */
height: 287px; height: 287px;
overflow: hidden; overflow: hidden;
} }
section .whoil .whoil-1 .swiper-slide .clips1 {
text-align: center;
width: 284px;
padding: 10px 0;
}
section .whoil .whoil-1 .swiper-container .swiper-button-prev, section .whoil .whoil-1 .swiper-container .swiper-button-prev,
section .whoil .whoil-1 .swiper-container .swiper-button-next { section .whoil .whoil-1 .swiper-container .swiper-button-next {

View File

@ -20,210 +20,169 @@ section .whole {
margin: auto; margin: auto;
} }
section .whole .whole-1, section .whole .whole-1 {
section .whole .setall {
margin: 20px auto; margin: 20px auto;
width: 1200px; width: 1200px;
padding: 25px; padding: 25px;
background-color: #ffffff; background-color: #ffffff;
} }
section .whole .whole-1 .all, section .whole .whole-1 .all {
section .whole .setall .all {
display: inline-block; display: inline-block;
} }
section .whole .whole-1 .all h2, section .whole .whole-1 .all h2 {
section .whole .setall .all h2 {
font-weight: 600; font-weight: 600;
float: left; float: left;
padding-bottom: 10px; padding-bottom: 10px;
} }
/* 买家 */
section .whole .whole-1 .Buyers, section .whole .whole-1 .Buyers {
section .whole .whole-1 .opt,
section .whole .setall .Buyers,
section .whole .setall .opt {
padding: 25px; padding: 25px;
} }
section .whole .whole-1 .toggle, section .whole .whole-1 .toggle,
section .whole .whole-1 .commodity, section .whole .whole-1 .commodity {
section .whole .setall .toggle,
section .whole .setall .commodity {
padding: 20px; padding: 20px;
} }
section .whole .whole-1 .Subtitle, section .whole .whole-1 .Subtitle {
section .whole .setall .Subtitle {
font-weight: 800; font-weight: 800;
} }
section .whole .whole-1 .Buyers, section .whole .whole-1 .Buyers {
section .whole .setall .Buyers {
border-top: 2px solid #cb1919; border-top: 2px solid #cb1919;
border-bottom: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2;
background-color: #fff; background-color: #fff;
} }
section .whole .whole-1 .Buyers #container span:nth-child(2), section .whole .whole-1 .Buyers #container span:nth-child(2) {
section .whole .setall .Buyers #container span:nth-child(2) {
float: right; float: right;
} }
section .whole .whole-1 .Buyers #container span:nth-child(2) a, section .whole .whole-1 .Buyers #container span:nth-child(2) a {
section .whole .setall .Buyers #container span:nth-child(2) a {
color: #066ee2; color: #066ee2;
} }
section .whole .whole-1 .Buyers #container #wrap, section .whole .whole-1 .Buyers #container #wrap {
section .whole .setall .Buyers #container #wrap {
overflow: hidden; overflow: hidden;
margin-top: 20px; margin-top: 20px;
} }
section .whole .whole-1 .Buyers #container #wrap .address, section .whole .whole-1 .Buyers #container #wrap .address {
section .whole .setall .Buyers #container #wrap .address {
display: flex; display: flex;
align-items: center; align-items: center;
} }
section .whole .whole-1 .Buyers #container #wrap .address .name, section .whole .whole-1 .Buyers #container #wrap .address .name {
section .whole .setall .Buyers #container #wrap .address .name {
display: inline-block; display: inline-block;
padding: 10px 50px; padding: 10px 50px;
} }
section .whole .whole-1 .Buyers #container #wrap .address .na-1, section .whole .whole-1 .Buyers #container #wrap .address .na-1 {
section .whole .setall .Buyers #container #wrap .address .na-1 {
border: solid 2px #cb1919; border: solid 2px #cb1919;
} }
section .whole .whole-1 .Buyers #container #wrap .address .na-2, section .whole .whole-1 .Buyers #container #wrap .address .na-2 {
section .whole .setall .Buyers #container #wrap .address .na-2 {
margin-top: 10px; margin-top: 10px;
border: solid 2px #d1d1d1; border: solid 2px #d1d1d1;
} }
section .whole .whole-1 .Buyers #container #wrap .address p, section .whole .whole-1 .Buyers #container #wrap .address p {
section .whole .setall .Buyers #container #wrap .address p {
margin: 0px 15px; margin: 0px 15px;
} }
section .whole .whole-1 .Buyers #container #wrap .address-2 a, section .whole .whole-1 .Buyers #container #wrap .address-2 a {
section .whole .setall .Buyers #container #wrap .address-2 a {
color: #066ee2; color: #066ee2;
} }
section .whole .whole-1 .Buyers #container #wrap .stop, section .whole .whole-1 .Buyers #container #wrap .stop {
section .whole .setall .Buyers #container #wrap .stop {
padding: 20px 20px; padding: 20px 20px;
} }
section .whole .whole-1 .Buyers #container #read-more, section .whole .whole-1 .Buyers #container #read-more {
section .whole .setall .Buyers #container #read-more {
margin-top: 20px; margin-top: 20px;
} }
/* 送货清单 */
section .whole .whole-1 .opt, section .whole .whole-1 .opt {
section .whole .setall .opt { padding: 25px;
margin-bottom: 20px; margin-bottom: 20px;
border-bottom: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2;
} }
section .whole .whole-1 .opt ul .optall table, section .whole .whole-1 .opt ul .optall table {
section .whole .setall .opt ul .optall table {
width: 100%; width: 100%;
background-color: #f3f3f3; background-color: #f3f3f3;
margin-bottom: 20px; margin-bottom: 20px;
} }
section .whole .whole-1 .opt ul .optall #checkall, section .whole .whole-1 .opt ul .optall #checkall {
section .whole .setall .opt ul .optall #checkall {
margin-left: 10px; margin-left: 10px;
} }
section .whole .whole-1 .opt ul .optall th, section .whole .whole-1 .opt ul .optall th {
section .whole .setall .opt ul .optall th {
height: 50px; height: 50px;
} }
section .whole .whole-1 .opt ul .optall th span, section .whole .whole-1 .opt ul .optall th span {
section .whole .setall .opt ul .optall th span {
margin-left: 85px; margin-left: 85px;
} }
section .whole .whole-1 .opt .checklist .among table, section .whole .whole-1 .opt .checklist .among table {
section .whole .setall .opt .checklist .among table {
width: 100%; width: 100%;
background-color: #fff; background-color: #fff;
} }
section .whole .whole-1 .opt .checklist .among th, section .whole .whole-1 .opt .checklist .among th {
section .whole .setall .opt .checklist .among th {
height: 115px; height: 115px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(1), section .whole .whole-1 .opt .checklist .among th:nth-child(1) {
section .whole .setall .opt .checklist .among th:nth-child(1) {
width: 100px; width: 100px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(1) img, section .whole .whole-1 .opt .checklist .among th:nth-child(1) img {
section .whole .setall .opt .checklist .among th:nth-child(1) img {
padding: 10px; padding: 10px;
width: 82px; width: 82px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(2), section .whole .whole-1 .opt .checklist .among th:nth-child(2) {
section .whole .setall .opt .checklist .among th:nth-child(2) {
width: 300px; width: 300px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(4) > input, section .whole .whole-1 .opt .checklist .among th:nth-child(4) > input {
section .whole .setall .opt .checklist .among th:nth-child(4) > input {
width: 80px; width: 80px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(3), section .whole .whole-1 .opt .checklist .among th:nth-child(4), section .whole .whole-1 .opt .checklist .among th:nth-child(6), section .whole .whole-1 .opt .checklist .among th:nth-child(3), section .whole .whole-1 .opt .checklist .among th:nth-child(4), section .whole .whole-1 .opt .checklist .among th:nth-child(6) {
section .whole .setall .opt .checklist .among th:nth-child(3),
section .whole .setall .opt .checklist .among th:nth-child(4),
section .whole .setall .opt .checklist .among th:nth-child(6) {
width: 162px; width: 162px;
text-align: center; text-align: center;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(5), section .whole .whole-1 .opt .checklist .among th:nth-child(5) {
section .whole .setall .opt .checklist .among th:nth-child(5) {
width: 120px; width: 120px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(5) input, section .whole .whole-1 .opt .checklist .among th:nth-child(5) input {
section .whole .setall .opt .checklist .among th:nth-child(5) input {
text-align: center; text-align: center;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(5) input:nth-child(1), section .whole .whole-1 .opt .checklist .among th:nth-child(5) input:nth-child(3), section .whole .whole-1 .opt .checklist .among th:nth-child(5) input:nth-child(1), section .whole .whole-1 .opt .checklist .among th:nth-child(5) input:nth-child(3) {
section .whole .setall .opt .checklist .among th:nth-child(5) input:nth-child(1),
section .whole .setall .opt .checklist .among th:nth-child(5) input:nth-child(3) {
width: 15px; width: 15px;
} }
section .whole .whole-1 .opt .checklist .among th:nth-child(5) input:nth-child(2), section .whole .whole-1 .opt .checklist .among th:nth-child(5) input:nth-child(2) {
section .whole .setall .opt .checklist .among th:nth-child(5) input:nth-child(2) {
width: 30px; width: 30px;
} }
/* 使用优惠券 */
section .whole .whole-1 .coupon, section .whole .whole-1 .coupon {
section .whole .setall .coupon {
width: 100%; width: 100%;
display: inline-flex; display: inline-flex;
padding-bottom: 40px; padding-bottom: 40px;
border-bottom: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2;
} }
section .whole .whole-1 .coupon .yh, section .whole .whole-1 .coupon .yh {
section .whole .setall .coupon .yh {
width: 262px; width: 262px;
height: 130px; height: 130px;
margin-right: 25px; margin-right: 25px;
@ -231,23 +190,18 @@ section .whole .setall .coupon .yh {
section .whole .whole-1 .coupon .yh h1, section .whole .whole-1 .coupon .yh h1,
section .whole .whole-1 .coupon .yh h3, section .whole .whole-1 .coupon .yh h3,
section .whole .whole-1 .coupon .yh span, section .whole .whole-1 .coupon .yh span {
section .whole .setall .coupon .yh h1,
section .whole .setall .coupon .yh h3,
section .whole .setall .coupon .yh span {
color: #fff; color: #fff;
} }
section .whole .whole-1 .coupon .yh h1, section .whole .whole-1 .coupon .yh h1 {
section .whole .setall .coupon .yh h1 {
font-size: 50px; font-size: 50px;
position: relative; position: relative;
left: 30px; left: 30px;
top: 20px; top: 20px;
} }
section .whole .whole-1 .coupon .yh h3, section .whole .whole-1 .coupon .yh h3 {
section .whole .setall .coupon .yh h3 {
font-size: 17px; font-size: 17px;
position: relative; position: relative;
left: 91px; left: 91px;
@ -255,52 +209,47 @@ section .whole .setall .coupon .yh h3 {
font-weight: 700; font-weight: 700;
} }
section .whole .whole-1 .coupon .yh span, section .whole .whole-1 .coupon .yh span {
section .whole .setall .coupon .yh span {
position: relative; position: relative;
left: 91px; left: 91px;
top: -32px; top: -32px;
} }
section .whole .whole-1 .coupon .yh p, section .whole .whole-1 .coupon .yh p {
section .whole .setall .coupon .yh p {
color: #cb1919; color: #cb1919;
position: relative; position: relative;
text-align: center; text-align: center;
} }
/* 优惠卷的背景 */
section .whole .whole-1 .coupon .coupon-1, section .whole .whole-1 .coupon .coupon-1 {
section .whole .setall .coupon .coupon-1 {
background: url("../../img/images/coupon-1.png"); background: url("../../img/images/coupon-1.png");
margin-left: 50px; margin-left: 50px;
} }
section .whole .whole-1 .coupon .coupon-2, section .whole .whole-1 .coupon .coupon-2 {
section .whole .setall .coupon .coupon-2 {
background: url("../../img/images/coupon-2.png"); background: url("../../img/images/coupon-2.png");
} }
section .whole .whole-1 .coupon .coupon-3, section .whole .whole-1 .coupon .coupon-3 {
section .whole .setall .coupon .coupon-3 {
background: url("../../img/images/coupon-3.png"); background: url("../../img/images/coupon-3.png");
} }
section .whole .whole-1 .coupon .coupon-3 p, section .whole .whole-1 .coupon .coupon-3 p {
section .whole .setall .coupon .coupon-3 p {
color: #d2d2d2; color: #d2d2d2;
} }
/* 备注 */
section .whole .whole-1 .remarks, section .whole .whole-1 .remarks {
section .whole .setall .remarks {
padding-top: 30px; padding-top: 30px;
} }
section .whole .whole-1 .remarks .layui-textarea, section .whole .whole-1 .remarks .layui-textarea {
section .whole .setall .remarks .layui-textarea {
background-color: #fcfcfc; background-color: #fcfcfc;
} }
/* 提交订单 */
section .whole .setall { section .whole .setall {
margin: 20px auto;
width: 1200px;
padding: 25px;
background-color: #fff; background-color: #fff;
border: 1px solid #e0e0e0; border: 1px solid #e0e0e0;
margin-top: 25px; margin-top: 25px;
@ -318,7 +267,7 @@ section .whole .setall .seta li {
section .whole .setall .seta li span { section .whole .setall .seta li span {
float: right; float: right;
} }
/* 送货地址 */
section .whole .setall .total { section .whole .setall .total {
border-top: 1px solid #e0e0e0; border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;
@ -342,14 +291,14 @@ section .whole .setall .total li span {
section .whole .setall .total li p { section .whole .setall .total li p {
color: #ababab; color: #ababab;
} }
/* 提交按钮 */
section .whole .setall .subore { section .whole .setall .subore {
padding: 30px 0px; padding: 30px 0px;
height: 20px; height: 20px;
} }
section .whole .setall .subore span { section .whole .setall .subore li {
padding: 15px 35px; padding: 15px 35px;
background-color: #cb1919; background-color: #cb1919;
color: #fff; color: #fff;

View File

@ -20,13 +20,6 @@
} }
</style> </style>
<script> <script>
// function Phone() {
// var phone = document.getElementById('phone').value;
// if (!(/^1[3|4|5|7|8]\d{9}$/.test(phone))) {
// alert("手机号码有误,请重填");
// return false;
// }
// }
$(function () { $(function () {
let reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/; let reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
$('#phone').click(function () { $('#phone').click(function () {
@ -61,9 +54,9 @@
<!-- 身份 --> <!-- 身份 -->
<div class="identity"> <div class="identity">
<ul> <ul>
<li><a href="reg.html" class="set_1_btn Vbtn-2">个人会员</a> <li><a href="reg.html" class="set_1_btn Vbtn-2 member">个人会员</a>
<a href="mecha.html" class="set_1_btn Vbtn-2">机构会员</a> <a href="mecha.html" class="set_1_btn Vbtn-2 member">机构会员</a>
<a href="#" class="set_1_btn Vbtn-2">艺术家会员</a> <a href="#" class="set_1_btn Vbtn-2 member">艺术家会员</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -95,7 +88,7 @@
maxlength="11" autocomplete="off" class="layui-input" value=""> maxlength="11" autocomplete="off" class="layui-input" value="">
</div> </div>
</div> </div>
<!-- 验证--> <!-- 验证i-->
<div class="layui-form-item"> <div class="layui-form-item">
<div class="layui-input-block codes"> <div class="layui-input-block codes">
<input type="text" name="title" required lay-verify="required" placeholder="验证码" <input type="text" name="title" required lay-verify="required" placeholder="验证码"
@ -129,7 +122,7 @@
</div> </div>
<div class="bot"> <div class="bot">
<!-- <a href="" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> --> <!-- <a href="" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> -->
<a href="" class="font-set">已有账号,立即登录</a> <a href="./login.html" class="font-set">已有账号,立即登录</a>
</div> </div>
</div> </div>

View File

@ -41,9 +41,9 @@
<!-- 身份 --> <!-- 身份 -->
<div class="identity"> <div class="identity">
<ul> <ul>
<li><a href="#" class="set_1_btn Vbtn-2">个人会员</a> <li><a href="#" class="set_1_btn Vbtn-2 member">个人会员</a>
<a href="mecha.html" class="set_1_btn Vbtn-2">机构会员</a> <a href="#" class="set_1_btn Vbtn-2 member">机构会员</a>
<a href="artist.html" class="set_1_btn Vbtn-2">艺术家会员</a> <a href="#" class="set_1_btn Vbtn-2 member">艺术家会员</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -61,17 +61,6 @@
autocomplete="off" class="layui-input"> autocomplete="off" class="layui-input">
</div> </div>
</div> </div>
<!-- 验证码 -->
<div class="layui-form-item">
<div class="layui-input-block codes">
<input type="text" name="title" required lay-verify="required" placeholder="请输入验证码"
autocomplete="off" class="layui-input verity">
<li>
<p>发送手机验证码</p>
</li>
</div>
</div>
<!-- 登录 --> <!-- 登录 -->
<div class="layui-form-item"> <div class="layui-form-item">
<div class="layui-input-block"> <div class="layui-input-block">
@ -79,7 +68,7 @@
</div> </div>
</div> </div>
<div class="bot"> <div class="bot">
<a href="ret.html" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> <a href="ret.html" class="font-set">忘记密码?</a> <a href="./reg.html" class="font-set">没有账号,立即注册新用户</a>
</div> </div>
</div> </div>

View File

@ -26,7 +26,6 @@
</style> </style>
<body> <body>
<header> <header>
<!-- 背景图 --> <!-- 背景图 -->
<div class="bac"></div> <div class="bac"></div>
<!-- 输入框 --> <!-- 输入框 -->
@ -40,9 +39,9 @@
<!-- 身份 --> <!-- 身份 -->
<div class="identity"> <div class="identity">
<ul> <ul>
<li><a href="reg.html" class="set_1_btn Vbtn-2">个人会员</a> <li><a href="reg.html" class="set_1_btn Vbtn-2 member">个人会员</a>
<a href="#" class="set_1_btn Vbtn-2">机构会员</a> <a href="#" class="set_1_btn Vbtn-2 member">机构会员</a>
<a href="artist.html" class="set_1_btn Vbtn-2">艺术家会员</a> <a href="artist.html" class="set_1_btn Vbtn-2 member">艺术家会员</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -108,7 +107,7 @@
</div> </div>
<div class="bot"> <div class="bot">
<!-- <a href="" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> --> <!-- <a href="" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> -->
<a href="" class="font-set">已有账号,立即登录</a> <a href="./login.html" class="font-set">已有账号,立即登录</a>
</div> </div>
</div> </div>

View File

@ -33,9 +33,9 @@
<!-- 身份 --> <!-- 身份 -->
<div class="identity"> <div class="identity">
<ul> <ul>
<li><a href="#" class="set_1_btn Vbtn-2">个人会员</a> <li><a href="#" class="set_1_btn Vbtn-2 member">个人会员</a>
<a href="mecha.html" class="set_1_btn Vbtn-2">机构会员</a> <a href="mecha.html" class="set_1_btn Vbtn-2 member">机构会员</a>
<a href="artist.html" class="set_1_btn Vbtn-2">艺术家会员</a> <a href="artist.html" class="set_1_btn Vbtn-2 member">艺术家会员</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -59,7 +59,7 @@
<input type="text" name="title" required lay-verify="required" placeholder="请输入验证码" <input type="text" name="title" required lay-verify="required" placeholder="请输入验证码"
autocomplete="off" class="layui-input verity"> autocomplete="off" class="layui-input verity">
<li> <li>
<p>发送手机验证码</p> <p onclick="sentout()">发送手机验证码</p>
</li> </li>
</div> </div>
</div> </div>
@ -87,7 +87,7 @@
</div> </div>
<div class="bot"> <div class="bot">
<!-- <a href="" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> --> <!-- <a href="" class="font-set">忘记密码?</a> <a href="" class="font-set">没有账号,立即注册新用户</a> -->
<a href="" class="font-set">已有账号,立即登录</a> <a href="./login.html" class="font-set">已有账号,立即登录</a>
</div> </div>
</div> </div>

View File

@ -11,7 +11,6 @@
<script src="../../js/swiper-bundle.min.js"></script> <script src="../../js/swiper-bundle.min.js"></script>
<link rel="stylesheet" type="text/css" href="../../css/foot.min.css" /> <link rel="stylesheet" type="text/css" href="../../css/foot.min.css" />
<script src="../../js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script> <script src="../../js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
</head> </head>
<style> <style>
.foot-iframe { .foot-iframe {
@ -26,10 +25,11 @@
top: -50px; top: -50px;
} }
</style> </style>
<body> <body>
<!-- 头部导航 --> <!-- 头部导航 -->
<iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" <iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0"
scrolling="no"></iframe> scrolling="no"></iframe>
<section> <section>
<div class="whoil"> <div class="whoil">
<div class="whoil-1"> <div class="whoil-1">
@ -40,10 +40,10 @@
</th> </th>
<!-- 选择 --> <!-- 选择 -->
<table> <table style="text-align: left;">
<thead> <thead>
<tr> <tr>
<th><input type="checkbox" id="ckAll" onclick="checkAll()">全选</th> <th><input type="checkbox" id="ckAll" onclick="checkAll()">&nbsp;&nbsp;全选</th>
<th>商品</th> <th>商品</th>
<th>单价</th> <th>单价</th>
<th>数量</th> <th>数量</th>
@ -53,17 +53,33 @@
</thead> </thead>
<tbody> <tbody>
<tr class="inline"> <tr class="inline">
<td><input type="checkbox" name="ck" onclick="check()"></td> <th><input type="checkbox" name="ck" onclick="check()"><img src="../../img/images/1-1.png"
<td><img src="../../img/images/1-1.png" alt="图片丢失" title="购物车图片一"><span>竹迪 alt="图片丢失" title="购物车图片一"></th>
客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 <td><span>竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 11时来运转8190</span>
11时来运转8190</span>
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span> <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span>
</td> </td>
<td>188.00</td> <td>188.00</td>
<td> <td>
<span class="reduce" onclick="reduceCount(this)">-</span> <button class="reduce" onclick="reduceCount(this)">-</button>
<input type="text" value="3" class="count-input">
<button class="add" onclick="addCount(this)">+</button>
</td>
<td>564.00</td>
<td>
<span class="delete" onclick="del(this)">删除</span>
</td>
</tr>
<tr class="inline">
<th><input type="checkbox" name="ck" onclick="check()"><img src="../../img/images/1-2.png"
alt="图片丢失" title="购物车图片二"></th>
<td><span>竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 11时来运转8190</span>
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span>
</td>
<td>188.00</td>
<td>
<button class="reduce" onclick="reduceCount(this)">-</button>
<input type="text" value="1" class="count-input"> <input type="text" value="1" class="count-input">
<span class="add" onclick="addCount(this)">+</span> <button class="add" onclick="addCount(this)">+</button>
</td> </td>
<td>188.00</td> <td>188.00</td>
<td> <td>
@ -71,17 +87,16 @@
</td> </td>
</tr> </tr>
<tr class="inline"> <tr class="inline">
<td><input type="checkbox" name="ck" onclick="check()"></td> <th><input type="checkbox" name="ck" onclick="check()"><img src="../../img/images/1-3.png"
<td><img src="../../img/images/1-2.png" alt="图片丢失" title="购物车图片二" ><span>竹迪 alt="图片丢失" title="购物车图片三"></th>
客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 <td><span>竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 11时来运转8190</span>
11时来运转8190</span>
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span> <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span>
</td> </td>
<td>188.00</td> <td>188.00</td>
<td> <td>
<span class="reduce" onclick="reduceCount(this)">-</span> <button class="reduce" onclick="reduceCount(this)">-</button>
<input type="text" value="1" class="count-input"> <input type="text" value="1" class="count-input">
<span class="add" onclick="addCount(this)">+</span> <button class="add" onclick="addCount(this)">+</button>
</td> </td>
<td>188.00</td> <td>188.00</td>
<td> <td>
@ -89,35 +104,16 @@
</td> </td>
</tr> </tr>
<tr class="inline"> <tr class="inline">
<td><input type="checkbox" name="ck" onclick="check()"></td> <th><input type="checkbox" name="ck" onclick="check()"><img src="../../img/images/1-4.png"
<td><img src="../../img/images/1-3.png" alt="图片丢失" title="购物车图片三"><span>竹迪 alt="图片丢失" title="购物车图片四"></th>
客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 <td><span>竹迪 客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画 11时来运转8190</span>
11时来运转8190</span>
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span> <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span>
</td> </td>
<td>188.00</td> <td>188.00</td>
<td> <td>
<span class="reduce" onclick="reduceCount(this)">-</span> <button class="reduce" onclick="reduceCount(this)">-</button>
<input type="text" value="1" class="count-input"> <input type="text" value="1" class="count-input">
<span class="add" onclick="addCount(this)">+</span> <button class="add" onclick="addCount(this)">+</button>
</td>
<td>188.00</td>
<td>
<span class="delete" onclick="del(this)">删除</span>
</td>
</tr>
<tr class="inline">
<td><input type="checkbox" name="ck" onclick="check()"></td>
<td><img src="../../img/images/1-4.png" alt="图片丢失" title="购物车图片四"><span>竹迪
客厅装饰画现代简约晶瓷画沙发背景墙挂画三联画餐厅墙画<br />靠山书房壁画抽象艺术画
11时来运转8190</span>
<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x3</span>
</td>
<td>188.00</td>
<td>
<span class="reduce" onclick="reduceCount(this)">-</span>
<input type="text" value="1" class="count-input">
<span class="add" onclick="addCount(this)">+</span>
</td> </td>
<td>188.00</td> <td>188.00</td>
<td> <td>
@ -127,71 +123,114 @@
</tbody> </tbody>
<tfoot id="foot"> <tfoot id="foot">
<tr> <tr>
<td><input type="checkbox" id="ckAll" onclick="checkAll()">&nbsp;&nbsp;全选</td> <th><input type="checkbox" id="ckAll" onclick="checkAll()">&nbsp;&nbsp;全选</th>
<td><span class="delete" onclick="del(this)">删除</span></td> <td valgin="left"><span class="delete" onclick="del(this)">删除</span></td>
<td></td> <td></td>
<td>总数:<span id="allCount"></span></td> <td>总数:<span id="allCount"></span></td>
<td>总价:¥<span id="allPrice"></span></td> <td>总价:¥<span id="allPrice"></span></td>
<td><span id="accounts" onclick="accounts();">结算</span></td> <td><a href="./tobepaid.html"><span id="accounts" onclick="accounts();">结算</span></a></td>
</tr> </tr>
</tfoot> </tfoot>
</table> </table>
<!-- 轮播图 -->
<div class="swiper-container"> <div class="swiper-container">
<div class="swiper-text"> <div class="swiper-text">
推荐商品 推荐商品
</div> </div>
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide"><img alt="图片丢失" title="图片一" src="../../img/images/1.png" ></div> <div class="swiper-slide"><img alt="图片丢失" title="图片一" src="../../img/images/1.png">
<div class="swiper-slide"><img alt="图片丢失" title="图片二" src="../../img/images/2.png" ></div> <div class="font-20 m-sx16 clips1">艺术之乐 · 百名艺术家酒标展</div>
<div class="swiper-slide"><img alt="图片丢失" title="图片三" src="../../img/images/3.png" ></div> </div>
<div class="swiper-slide"><img alt="图片丢失" title="图片四" src="../../img/images/4.png" ></div> <div class="swiper-slide"><img alt="图片丢失" title="图片二" src="../../img/images/2.png">
<div class="swiper-slide"><img alt="图片丢失" title="图片一" src="../../img/images/1.png" ></div> <div class="font-20 m-sx16 clips1">艺术之乐 · 百名艺术家酒标展</div>
</div>
<div class="swiper-slide"><img alt="图片丢失" title="图片三" src="../../img/images/3.png">
<div class="font-20 m-sx16 clips1">艺术之乐 · 百名艺术家酒标展</div>
</div>
<div class="swiper-slide"><img alt="图片丢失" title="图片四" src="../../img/images/4.png">
<div class="font-20 m-sx16 clips1">艺术之乐 · 百名艺术家酒标展</div>
</div>
<div class="swiper-slide"><img alt="图片丢失" title="图片一" src="../../img/images/1.png">
<div class="font-20 m-sx16 clips1">艺术之乐 · 百名艺术家酒标展</div>
</div>
</div> </div>
<!-- 如果需要分页器 --> <!-- 分页器 -->
<div class="swiper-pagination"></div> <div class="swiper-pagination"></div>
<!-- 如果需要导航按钮 --> <!-- 导航按钮 -->
<div class="swiper-button-prev"></div> <div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div> <div class="swiper-button-next"></div>
</div> </div>
</div> </div>
</section> </section>
<script> <script>
var mySwiper = new Swiper('.swiper-container', { // 轮播
loop: true, // 循环模式 $(window).resize(function () {//监听窗口大小的改变
slidesPerView: 5,//显示数量 sixSwiper()
spaceBetween: 25,//图片间距
autoplay: {
delay: 3000,
stopOnLastSlide: true,
disableOnInteraction: true,//是否禁止自动切换
},
// 分页器
pagination: {
el: '.swiper-pagination',
clickable: true,//点击跳转
},
navigation: {
nextEl: '.swiper-button-next',//左按钮
prevEl: '.swiper-button-prev',//右按钮
},
//鼠标移入变手
grabCursor: true,
}) })
// 鼠标移入轮播图范围,执行的函数 function sixSwiper() {
mySwiper.el.onmouseover = function () { let showNum = 4
mySwiper.autoplay.stop(); let beforeNum = 15
mySwiper.navigation.$nextEl.removeClass('hide'); let centeredSlides = true//是否显示半截
mySwiper.navigation.$prevEl.removeClass('hide'); let spaceBetween = 25//图片间距
} let windowWidth = $(window).width()
// 鼠标移出轮播图范围,执行的函数 if (windowWidth * 1 <= 900) {
mySwiper.el.onmouseout = function () { showNum = 2
mySwiper.autoplay.start(); beforeNum = 0
mySwiper.navigation.$nextEl.addClass('hide'); centeredSlides = false
mySwiper.navigation.$prevEl.addClass('hide'); spaceBetween = 10
} } else if (windowWidth * 1 <= 1000) {
showNum = 3
beforeNum = 0
centeredSlides = false
spaceBetween = 10
} else if (windowWidth * 1 <= 1200) {
showNum = 3
beforeNum = 0
centeredSlides = false
} else if (windowWidth * 1 <= 1450) {
showNum = 4
beforeNum = 0
spaceBetween = 10
centeredSlides = true
}
let myswiper = new Swiper('.swiper-container', {
cssMode: false,//禁止鼠标滑动,切换
loop: true,
slidesPerView: showNum,//显示数量
spaceBetween: spaceBetween,//图片间距
slidesOffsetBefore: beforeNum,
autoplay: {
delay: 2000,
stopOnLastSlide: true,
disableOnInteraction: false,
},
// 分页器
pagination: {
el: '.swiper-pagination',
clickable: true,//点击跳转
},
navigation: {
nextEl: '.swiper-button-next',//左按钮
prevEl: '.swiper-button-prev',//右按钮
},
grabCursor: true,//鼠标移入变手
});
// 鼠标移入轮播图范围,执行的函数
myswiper.el.onmouseover = function () {
myswiper.autoplay.stop();
myswiper.navigation.$nextEl.removeClass('hide');
myswiper.navigation.$prevEl.removeClass('hide');
}
// 鼠标移出轮播图范围,执行的函数
myswiper.el.onmouseout = function () {
myswiper.autoplay.start();
myswiper.navigation.$nextEl.addClass('hide');
myswiper.navigation.$prevEl.addClass('hide');
}
}
sixSwiper()
//获取元素 //获取元素
var ckAll = document.getElementById('ckAll'); var ckAll = document.getElementById('ckAll');
var cks = document.getElementsByName('ck'); var cks = document.getElementsByName('ck');
@ -201,15 +240,14 @@
var countInput = document.getElementsByClassName('count-input'); var countInput = document.getElementsByClassName('count-input');
var accounts = document.getElementById("accounts"); var accounts = document.getElementById("accounts");
// 结算 // 结算
// function accounts(){ function accounts() {
// var sum=0; var sum = 0;
// } }
// function accounts() { function accounts() {
accounts.style.display = "block";
// accounts.style.display = "block"; alert("")
// alert("") accounts.innerHTML = str;
// accounts.innerHTML = str; }
// }
//计算总数 //计算总数
function sumCount() { function sumCount() {
@ -248,19 +286,8 @@
} }
} }
// // 输入数量的最大值
// functionb (num){
// if(value.length<8){
// var btn1 = document.getElementById("org");
// btn1.insertBefore(input1, null);
// }else{
// alert("不能再添加");
// }
// }
//数量增加 //数量增加
function addCount(e) { function addCount(e) {
// 获取input标签里的value值,数量
var num = parseInt(e.previousElementSibling.value); var num = parseInt(e.previousElementSibling.value);
// 最大数量 // 最大数量
if (num > 98) { if (num > 98) {
@ -298,19 +325,16 @@
sumCount(); sumCount();
} }
//复选框的交互 //复选框
function check() { function check() {
// 判断四个小的复选框有没有没被选中的,如果有一个,就把ckAllde的checked 变为false
for (var i = 0; i < cks.length; i++) { for (var i = 0; i < cks.length; i++) {
if (cks[i].checked == false) { if (cks[i].checked == false) {
ckAll.checked = false; ckAll.checked = false;
sumPrice(); sumPrice();
sumCount(); sumCount();
// 有一个小复选框为false,就不需要对其他复选框进行判断了,直接中止函数下面的执行语句
return; return;
} }
} }
//循环结束后,如果小复选框checked的值都为true,ckAll的checked的值就为true
ckAll.checked = true; ckAll.checked = true;
sumPrice(); sumPrice();
sumCount(); sumCount();
@ -324,6 +348,7 @@
} }
</script> </script>
<!-- 底部导航 --> <!-- 底部导航 -->
<iframe src="../../public/foot-tab.html" class="foot-iframe" frameborder="0" scrolling="no" <iframe src="../../public/foot-tab.html" class="foot-iframe" frameborder="0" scrolling="no"
marginwidth='0'></iframe> marginwidth='0'></iframe>

View File

@ -27,9 +27,8 @@
<body> <body>
<!-- 头部导航 --> <!-- 头部导航 -->
<iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" <iframe src="../../public/center-head.html" class="ty_herader" width="100%" height="285px" frameborder="0" scrolling="no"></iframe>
scrolling="no"></iframe> <!-- 内容 -->
<!-- 内容 -->
<section> <section>
<div class="whole"> <div class="whole">
<div class="whole-1"> <div class="whole-1">
@ -76,7 +75,7 @@
<ul class="checklist"> <ul class="checklist">
<li class="among"> <li class="among">
<table> <table>
<th> <label for="value1"><img src="../../img/images/1-1.png" alt="图片丢失" title="商品1"></label> <th> <label for="value1"><img src="../../img/images/1-1.png" alt="图片丢失" title="商品1"></label>
</th> </th>
<th><span> <th><span>
创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办<br />公室博古架抽象艺术工艺品 牛气冲天+运势如虹 创意牛气冲天牛摆件现代简约家居装饰品牛摆设电视柜玄关办<br />公室博古架抽象艺术工艺品 牛气冲天+运势如虹
@ -143,14 +142,15 @@
<li>运费:<span>¥0.00 </span></li> <li>运费:<span>¥0.00 </span></li>
<li>商品优惠:<span>-¥20.00 </span></li> <li>商品优惠:<span>-¥20.00 </span></li>
</ul> </ul>
<!-- 送货地址 -->
<div class="total"> <div class="total">
<li>应付总额:<span>¥1123.00</span></li> <li>应付总额:<span>¥1123.00</span></li>
<li> <li>
<p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p> <p>程鹏龙 四川 成都市 武侯区 城区 人民南路四段成科西路3号 138****1234</p>
</li> </li>
</div> </div>
<!-- 提交按钮 -->
<div class="subore"> <div class="subore">
<!-- <li><span onclick="settlem();">提交订单</span></li> -->
<li><a href="qrcode.html" onclick="settlem();">提交订单</a></li> <li><a href="qrcode.html" onclick="settlem();">提交订单</a></li>
</div> </div>
</div> </div>
@ -159,14 +159,13 @@
</section> </section>
<!-- 底部导航 --> <!-- 底部导航 -->
<iframe src="../../public/foot-tab.html" class="foot-iframe" frameborder="0" scrolling="no" <iframe src="../../public/foot-tab.html" class="foot-iframe" frameborder="0" scrolling="no" marginwidth='0'></iframe>
marginwidth='0'></iframe>
<!-- 回到顶部 --> <!-- 回到顶部 -->
<img id="gotoTop" onclick="pageScroll()" src="../../img/public/backTop.png" alt="图片丢失" title="回到顶部"> <img id="gotoTop" onclick="pageScroll()" src="../../img/public/backTop.png" alt="图片丢失" title="回到顶部">
</body> </body>
<script src="../../js/jquery-1.9.1.js"></script> <script src="../../js/jquery-1.9.1.js"></script>
<script type="text/javascript"> <script type="text/javascript">
// 折叠 // 折叠地址
$(function () { $(function () {
var slideHeight = 50; // px var slideHeight = 50; // px
var defHeight = $('#wrap').height(); var defHeight = $('#wrap').height();