html:
<!DOCTYPE html
>
<
html
>
<
head
>
<
meta
charset=
"UTF-8"
>
<
title
>兑换列表
</
title
>
<
meta
content=
""
name=
"keywords"
/>
<
meta
content=
""
name=
"description"
/>
<
meta
name=
"viewport"
content=
"initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no"
>
<!-- <script type="text/javascript" src="dest/js/flexible.js"></script> -->
<
link
rel=
"stylesheet"
href=
"dest/css/exchange.css"
>
</
head
>
<
body
>
<
div
class=
"main dn"
id=
"page"
>
<!--loading-->
<
div
v-show=
"isLoading"
class=
"cover"
></
div
>
<
aside
v-show=
"isLoading"
class=
"loading-wrapper"
id=
"loadingWrapper"
>
<
div
>
<
div
class=
"loading-img"
></
div
>
<
div
class=
"loading-animate"
></
div
>
</
div
>
</
aside
>
<!-- 日期选择 -->
<
div
class=
"head"
>
<
div
class=
"nowTime"
>
</
div
>
<
ul
class=
"headDate"
>
</
ul
>
</
div
>
<!-- 可兑换机票列表 -->
<
div
class=
"listBox"
>
<
div
class=
"center"
id=
"listItem"
v-for=
"(flight,index) in flightList"
v-show=
"Object.keys(flightList).length > 0"
>
<
div
class=
"in-li"
>
<
div
class=
"inli-top"
>
<
div
class=
"inli-left"
>
<
span
>{{timeReversal(flight.StarTime).fullDate}}
</
span
>
<
span
>{{timeReversal(flight.StarTime).day}}
</
span
>
<
i
>{{timeReversal(flight.StarTime).fullHour}}
</
i
>-
<
i
>{{timeReversal(flight.EndTime).fullHour}}
</
i
>
</
div
>
<
b
class=
"rule" @
click=
"rule(flight.Rule)"
>
<
i
></
i
>
规则
</
b
>
<!-- 规则遮罩层 -->
<
div
class=
"rule_show"
>
<
div @
click=
"shutDown()"
class=
"shutDown"
></
div
>
<
p
class=
"txt"
>
{{flight.Rule}}
</
p
>
</
div
>
</
div
>
<
div
class=
"inli-cen"
>
<
div
class=
"in-mes"
>
<
div
class=
"inli-cenlt"
>
<
p
class=
"bold"
>{{flight.StartName}}
</
p
>
<
p
>{{flight.StartAirport}}
</
p
>
</
div
>
<
div
class=
"inli-cenc"
>
<
div
v-show=
"flight.Stopover == 'false' ? false :true"
>
<
span
>经停
</
span
>
<
b
>{{flight.Stopover}}
</
b
>
</
div
>
</
div
>
<
div
class=
"inli-cenrt"
>
<
p
class=
"bold"
>{{flight.EndName}}
</
p
>
<
p
>{{flight.EndAirport}}
</
p
>
</
div
>
</
div
>
<
div
class=
"in-yd"
>
<
span
>{{flight.SpecialFlightNo}}
</
span
>
<
br
>
<
span
>{{cabin_index(flight.Cabin_index) + flight.SpecialCabinCode}}舱
</
span
>
</
div
>
</
div
>
<
div
class=
"inli-top inli-bot"
>
<
div
class=
"inli-left moneyColor"
>
<
p
>
<
i
class=
"pointImg"
></
i
>
<
i
class=
"bold font200"
>{{flight.Price}}
</
i
>起
</
p
>
</
div
>
<
a
class=
"book" @
click=
"goOrder(flight)"
>立即预订
</
a
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
<
script
type=
"text/javascript"
src=
"dest/js/lib/vue.js"
>
<
/
script
>
<
script
type=
"text/javascript"
src=
"dest/js/lib/axios.min.js"
>
<
/
script
>
<
script
type=
"text/javascript"
src=
"dest/js/jquery-1.8.3.min.js"
>
<
/
script
>
<
script
type=
"text/javascript"
src=
"dest/js/exchange.min.js"
>
<
/
script
>
</
body
>
</
html
>
js:
var
date =
"";
var
Needlogintype;
var
ajaxUrl =
'/api/LowPriceAPI/GetLowPriceList?pageIndex=1&pageSize=10&userP=null&date=' +
date;
function
showTime() {
var
show_day =
new
Array(
'日',
'一',
'二',
'三',
'四',
'五',
'六');
var
time =
new
Date(
new
Date(
new
Date(
new
Date().
toLocaleDateString()).
getTime() -
86400000).
valueOf());
//获取零点,减去86400000是需求需要
var
year =
time.
getFullYear();
//年
var
month =
time.
getMonth() +
1;
//月
var
date =
time.
getDate();
//日
var
day =
time.
getDay();
//星期几
month <
10 ?
month =
'0' +
month :
month;
date <
10 ?
date =
'0' +
date :
date;
var
currentYear =
"<div class='left first'><p>" +
year +
'年' +
"</p><p>" +
month +
'月' +
"</p></div>";
//当前日期
var
startTime =
year +
"/" +
month +
"/" +
date;
//第十四天时间戳
//var lastTimeStamp = new Date(startTime).getTime() + 14 * 24 * 60 * 60 * 1000;
//第十四天时间
//var lastTime = new Date(lastTimeStamp);
var
canStamp =
new
Array();
var
calendar =
new
Array();
var
dataRule =
new
Array();
function
ifAddMonth(
time) {
var
obj = {};
if (
new
Date(
time).
getTime() ==
new
Date(
time).
setDate(
1)) {
obj.
addMonth =
"addMonth";
obj.
month =
new
Date(
new
Date(
time).
setDate(
1)).
getMonth() +
1;
obj.
year =
new
Date(
new
Date(
time).
setDate(
1)).
getFullYear()
}
else {
obj.
addMonth =
"";
obj.
month =
new
Date(
time).
getMonth() +
1;
obj.
year =
new
Date(
time).
getFullYear();
}
return
obj;
}
for (
var
i =
1;
i <
15;
i++) {
canStamp[
i] =
new
Date(
new
Date(
startTime).
getTime() +
i *
24 *
60 *
60 *
1000);
dataRule[
i] =
canStamp[
i].
getFullYear() +
'/' + (
canStamp[
i].
getMonth() +
1) +
'/' +
canStamp[
i].
getDate();
var
calday =
canStamp[
i].
getDate();
calday <
10 ?
calday =
'0' +
calday :
calday;
calendar[
i] =
"<li data-rule='" +
dataRule[
i] +
"' class='" +
ifAddMonth(
canStamp[
i]).
addMonth +
"' data-year = '" +
ifAddMonth(
canStamp[
i]).
year +
"' data-month='" +
ifAddMonth(
canStamp[
i]).
month +
"'><p>" +
show_day[
canStamp[
i].
getDay()] +
"</p><p>" +
calday +
"</p></li>"
}
$(
".nowTime").
html(
currentYear);
$(
".headDate").
append(
calendar.
toString().
replace(
/,/
g,
""));
if (!!
$(
".addMonth").
data()) {
var
newYear =
$(
".addMonth").
data(
"year"),
newMonth =
$(
".addMonth").
data(
"month");
$(
".addMonth").
before(
"<li class='left second' data-year='" +
newYear +
"'><p>" +
newYear +
'年' +
"</p><p>" +
newMonth +
'月' +
"</p></li>");
}
}
$(
function () {
showTime();
var
newYear =
$(
".addMonth").
data(
"year"),
newMonth =
$(
".addMonth").
data(
"month"),
oldYear =
new
Date(
$(
".headDate li").
eq(
0).
data(
"rule")).
getFullYear(),
oldMonth =
new
Date(
$(
".headDate li").
eq(
0).
data(
"rule")).
getMonth() +
1,
startX,
startY,
moveEndX,
moveEndY,
X,
Y;
$(
".headDate").
on(
"touchmove",
function (
e) {
$(
".nowTime").
css(
"position",
"fixed")
if (!!
$(
".second").
data(
"year")) {
if (
$(
".second").
offset().
left <
0) {
$(
".nowTime").
find(
"p").
eq(
0).
text(
newYear +
"年").
end().
eq(
1).
text(
newMonth >
10 ?
newMonth :
"0" +
newMonth +
"月");
}
else {
$(
".nowTime").
find(
"p").
eq(
0).
text(
oldYear +
"年").
end().
eq(
1).
text(
oldMonth >
10 ?
oldMonth :
"0" +
oldMonth +
"月");
}
}
});
$(
".headDate li").
click(
function () {
var
date =
$(
this).
data(
"rule");
vm.
init(
date);
})
$(
".listBox").
on(
"touchstart",
function (
e) {
startX =
e.
originalEvent.
changedTouches[
0].
pageX,
startY =
e.
originalEvent.
changedTouches[
0].
pageY;
});
$(
".listBox").
on(
"touchend",
function (
e) {
moveEndX =
e.
originalEvent.
changedTouches[
0].
pageX,
moveEndY =
e.
originalEvent.
changedTouches[
0].
pageY,
X =
moveEndX -
startX,
Y =
moveEndY -
startY;
if (
Y <
0) {
//上滑
$(
".nowTime").
css(
"position",
"static");
}
else
if (
Y >
0) {
//下滑
$(
".nowTime").
css(
"position",
"fixed");
}
})
$(
".listBox").
on(
"touchmove",
function (
e) {
$(
".nowTime").
css(
"position",
"static");
})
})
function
parseUrl(
url) {
var
pattern =
/
(
\w
+
)
=
([^
\#
&
]
*
)
/
ig,
parames = {};
url =
url ||
window.
location.
href;
url.
replace(
pattern,
function (
attr,
key,
value) {
parames[
key] =
decodeURI(
value);
});
return
parames;
}
//http://10.66.28.44:8999/api/LowPriceAPI/GetLowPriceList
var
vm =
new
Vue({
el:
"#page",
data: {
flightList: {},
isLoading:
true,
},
beforeMount() {},
mounted(
date) {
this.
init(
date);
},
methods: {
init(
date) {
var
_this =
this;
var
url;
if (
date) {
url =
'/api/LowPriceAPI/GetLowPriceList?pageIndex=1&pageSize=10&userP=null&date=' +
date;
}
else {
url =
'/api/LowPriceAPI/GetLowPriceList?pageIndex=1&pageSize=10&userP=null'
}
axios.
get(
url)
.
then(
function (
response) {
if (
response) {
_this.
flightList =
response.
data.
Data.
List || {};
Needlogintype =
response.
data.
Data.
Needlogintype || {};
}
})
.
finally((
res)
=> {
this.
isLoading =
false;
$(
"#page").
removeClass(
"dn")
})
.
catch(
function (
error) {});
},
//点击预定按钮事件
goOrder(
data) {
this.
goDate(
data);
var
dataarr =
data.
split(
",");
if (
this.
isInApp()) {
if (
this.
deviceType() ===
"iphone") {
registerOrderInfo(
dataarr[
0],
dataarr[
1],
dataarr[
2],
dataarr[
3],
dataarr[
4],
dataarr[
5],
dataarr[
6],
dataarr[
7],
dataarr[
8],
dataarr[
9],
dataarr[
10],
dataarr[
11],
dataarr[
12],
dataarr[
13],
dataarr[
14],
dataarr[
15],
dataarr[
16],
dataarr[
17]);
}
else {
AirportOrder.
registerOrderInfo(
dataarr[
0],
dataarr[
1],
dataarr[
2],
dataarr[
3],
dataarr[
4],
dataarr[
5],
dataarr[
6],
dataarr[
7],
dataarr[
8],
dataarr[
9],
dataarr[
10],
dataarr[
11],
dataarr[
12],
dataarr[
13],
dataarr[
14],
dataarr[
15],
dataarr[
16],
dataarr[
17]);
}
}
else {
window.
location.
href =
"https://m.ceair.com/mobile/book/flight-search!specialOffers.shtml?flightNo=" +
dataarr[
12] +
"&cabinCode=" +
dataarr[
13] +
"&tripType=" + (
dataarr[
4] ==
'1' ?
'OW' :
'RT') +
"&deptCode=" +
dataarr[
0] +
"&arrvCode=" +
dataarr[
1] +
"&deptDate=" +
dataarr[
2].
split(
" ")[
0].
split(
"-").
join(
"") +
"&goCodeType=0&productCode=" +
dataarr[
14] +
"&backCodeType=0"
}
},
//日期显示
timeReversal(
date) {
var
date =
date.
replace(
/-/
g,
'/');
var
t =
new
Date(
date),
m =
t.
getMonth() +
1,
y =
t.
getFullYear(),
d =
t.
getDate(),
day =
t.
getDay(),
hour =
t.
getHours(),
minutes =
t.
getMinutes(),
seconds =
t.
getSeconds();
var
arr = [
"周日",
"周一",
"周二",
"周三",
"周四",
"周五",
"周六"];
var
obj = {
year:
y,
month:
m <
10 ?
"0" +
m :
m,
date:
d <
10 ?
"0" +
d :
d,
day:
arr[
day],
hour:
hour <
10 ?
"0" +
hour :
hour,
minutes:
minutes <
10 ?
"0" +
minutes :
minutes,
seconds:
seconds <
10 ?
"0" +
seconds :
seconds,
};
obj.
fullDate =
obj.
year +
"-" +
obj.
month +
"-" +
obj.
date;
obj.
fullHour =
obj.
hour +
":" +
obj.
minutes;
return
obj;
},
//点击规则事件
rule() {
$(
".rule_show").
show();
},
//点击规则关闭事件
shutDown() {
$(
".rule_show").
hide();
console.
log(
vm)
},
//拼接点击预定按钮数据
goDate(
data) {
const
arrData =
new
Array();
const
t =
this.
timeReversal(
data.
StarTime);
const
t2 =
this.
timeReversal(
data.
EndTime);
arrData.
push(
data.
StartCode);
//出发机场三字码 index0
arrData.
push(
data.
EndCode);
//到达机场三字码 index1
const
startdate =
t.
year +
'' +
t.
month +
'' +
t.
date;
arrData.
push(
startdate);
//出发时间 index2
arrData.
push(
data.
Cabin_index);
//舱位 0所有舱 1经济舱 2经济全价舱 3头等舱 4公务舱 index3
arrData.
push(
data.
Triptype);
//1单程 2往返,index4
arrData.
push(
data.
Nextorgcode);
//返程城市 index5
arrData.
push(
data.
Nextdstcode);
//返程城市三字码 index6
arrData.
push(
data.
Nexttripdate);
//往返时间,如20150101, index7
arrData.
push(
data.
Flightype);
//国内 332 国际,index8
arrData.
push(
data.
IsRMB);
//人民币 index9
arrData.
push(
data.
IsB2G.
toString());
//版本 index10
arrData.
push(
Needlogintype);
//登录信息 如: FFP会员登录 index11
arrData.
push(
data.
SpecialFlightNo);
//去程的航班号 index12
arrData.
push(
data.
SpecialCabinCode);
//去程舱位 index13
arrData.
push(
data.
SpecialProductCode);
//去程的产品code index14
arrData.
push(
data.
NextSpecialFlightNo);
//回程的航班号 index15
arrData.
push(
data.
NextSpecialCabinCode);
//回程舱位 index16
arrData.
push(
data.
NextSpecialProductCode);
//回程的产品code index17
return
arrData.
join(
',');
},
//舱位显示
cabin_index(
e) {
var
txt =
"";
switch (
e) {
case
"0":
txt =
"所有舱位";
break;
case
"1":
txt =
"经济舱";
break;
case
"2":
txt =
"经济全价舱";
break;
case
"3":
txt =
"头等舱";
break;
case
"4":
txt =
"公务舱";
break;
default:
txt =
"";
};
return
txt;
}
},
computed: {
},
filters: {
}
});
less:
@charset
"utf-8";
html{
width:
100%;
height:
100%;
font-size:
62.5%;
}
body,
html,
dl,
dd,
p,
h4,
h5{
margin:
0;
padding:
0;
word-break:
break-all;
-ms-word-wrap:
break-word;
word-wrap:
break-word;
line-height:
180%;
}
img{
display:
block;
max-width:
100%;
height:
auto;}
li,
dd{
list-style:
none;}
em,
h4{
font-style:
normal;
font-weight:
normal}
/* Reset */
i{
font-style:
normal;}
*{
box-sizing:
border-box;
-moz-box-sizing:
border-box;
-webkit-box-sizing:
border-box;
}
:before,
:after{
box-sizing:
border-box;
-moz-box-sizing:
border-box;
-webkit-box-sizing:
border-box;
}
input:focus{
border:
none;}
body{
font-weight:
500;
font-size:
1.4rem;
font-family:
"Microsoft YaHei",
"Segoe UI",
"Lucida Grande",
Helvetica,
Arial, FreeSans, Arimo,
"Droid Sans",
"wenquanyi micro hei",
"Hiragino Sans GB",
"Hiragino Sans GB W3",
"FontAwesome",
sans-serif;
color:
#2e1623;
}
a{
text-decoration:
none;}
ul,
ol{
list-style:
none;}
.main {
width:
100%;
height:
auto;
overflow:
hidden;
background:
#F0EFF5;
}
.pointImg{
display:
inline-block;
background:
url(
../images/point.png
)
no-repeat
left
center;
background-size:
100%
auto;
width:
1rem;
height:
1rem;
}
.font200{
font-size:
2rem;
}
.m05{
margin:
0
5%;
}
.text-center{
text-align:
center;
}
.bold{
font-size:
125%;
}
.moneyColor{
color:
#ff7f00;
}
.center {
width:
94%;
margin:
3%
auto;
}
.in-li {
width:
100%;
border:
0.1rem
solid
#d2d2d5;
-webkit-border-radius:
0.5rem;
-moz-border-radius:
0.5rem;
-ms-border-radius:
0.5rem;
-o-border-radius:
0.5rem;
border-radius:
0.5rem;
color:
#798CA4;
background:
#fff;
margin-bottom:
4%;
}
.inli-top,
.inli-cen,
.inli-cen
.in-mes {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display:
flex;
-webkit-justify-content:
space-between;
-moz-justify-content:
space-between;
-ms-justify-content:
space-between;
-o-justify-content:
space-between;
justify-content:
space-between;
}
.inli-top,
.inli-cen {
border-bottom:
0.1rem
dotted
#d6d6d6;
}
.inli-cenlt,
.inli-cenrt{
text-align:
center;
}
.inli-top
.inli-left,
.inli-cen
.in-mes,
.in-mes
.inli-cenlt,
.in-mes
.inli-cenc,
.in-mes
.inli-cenrt ,
.more,
.book{
-webkit-box-flex:
1;
-moz-box-flex:
1;
-webkit-flex:
1;
-ms-flex:
1;
flex:
1;
}
.inli-top{
-webkit-align-items:
center;
-moz-align-items:
center;
-ms-align-items:
center;
-o-align-items:
center;
align-items:
center;
}
.inli-top
.inli-left{
-webkit-box-flex:
2;
-moz-box-flex:
2;
-webkit-flex:
2;
-ms-flex:
2;
flex:
2;
}
.text-over {
-webkit-box-orient:
vertical;
display: -webkit-box;
-webkit-line-clamp:
1;
overflow:
hidden;
}
.inli-left
span {
display:
inline-block;
border-right:
0.1rem
solid
#9aa8ba;
padding-right:
2%;
margin-right:
2%;
line-height:
120%;
}
.inli-left
.rule,
.inli-top
b {
color:
#5aa5f0;
font-weight:
100;
}
.inli-top
b {
white-space:
nowrap;
height:
2.1rem;
display:
block;
padding-left:
1.5rem;
position:
relative;
}
.inli-top
b
i{
background:
url(
"../images/i.png"
)
no-repeat
left
center;
background-size:
100%
auto;
width:
1.3rem;
height:
1.3rem;
position:
absolute;
left:
0;
top:
50%;
margin-top:
-.65rem;
}
.inli-left
.rule {
text-decoration:
underline;
margin-left:
5%;
}
.inli-cen
.in-mes {
padding-right:
3%;
-webkit-align-items:
center;
-moz-align-items:
center;
-ms-align-items:
center;
-o-align-items:
center;
align-items:
center;
}
.in-mes
span {
font-size:
2rem;
color:
#4A586A;
}
.inli-cenc
span {
color:
#FF7F00;
}
.inli-cenc
b {
color:
#798CA4;
font-weight:
normal;
}
.inli-cenc
span,
.inli-cenc
b {
display:
block;
line-height:
2.2rem;
font-size:
1rem;
}
.inli-cenc {
min-height:
1.5rem;
background:
url(
"../images/bg.png"
)
no-repeat
center;
text-align:
center;
background-size:
60%
auto;
height:
4.4rem;
}
.in-yd{
color:
#a7b2c1;
}
.in-yd
p {
font-size:
1.1rem;
white-space:
nowrap;
}
.in-yd
p
i {
font-size:
1.3rem;
font-weight:
100;
margin-right:
1%;
}
.in-yd
p
b {
font-size:
1.6rem;
font-weight:
900;
}
.book {
-webkit-border-radius:
0.5rem;
-moz-border-radius:
0.5rem;
-ms-border-radius:
0.5rem;
-o-border-radius:
0.5rem;
border-radius:
0.5rem;
width:
4rem;
text-align:
center;
height:
2.4rem;
line-height:
2.4rem;
}
.book {
display:
inline-block;
font-size:
1.5rem;
color:
#fff;
background:
#ff9a16;
border-radius:
0.5rem;
}
.moneyColor
p{
height:
2.4rem;
line-height:
2.4rem;
}
.inli-bot
.more {
color:
#798CA4;
border:
0.1rem
solid
#798CA4;
}
.inli-top,
.inli-cen,
.inli-bot {
padding:
2%
3%;
}
.inli-bot {
border-bottom:
none;
}
#loadStatus {
text-align:
center;
line-height:
200%;
color:
#999;
}
.rule_pop {
width:
100%;
height:
100%;
background:
rgba(
0,
0,
0,
0.8);
position:
fixed;
left:
0;
top:
0;
z-index:
999;
color:
#FFF;
}
.rule_pop
.rule_content {
padding:
1rem;
}
.head{
width:
100%;
overflow-x:
scroll;
position:
relative;
height:
5rem;
}
.nowTime{
height:
5rem;
width:
5rem;
float:
left;
position:
fixed;
left:
0;
top:
0;
z-index:
9;
background-color:
#5aa5f0;
color:
#fff;
text-align:
center;
p{
width:
5rem;
height:
2.5rem;
line-height:
2.5rem;
text-align:
center;
}
:
nth-child(
1){
line-height:
3rem;
}
:
nth-child(
2){
line-height:
2rem;
font-size:
1.8rem;
}
}
.headDate{
display:
block;
width:
auto;
height:
5rem;
text-align:
center;
background-color:
#5aa5f0;
word-wrap:
none;
overflow:
hidden;
-webkit-overflow-scrolling:
touch;
overflow-x:
scroll;
color:
#fff;
padding-left:
3%;
padding-right:
3%;
margin:
0 ;
width:
250%;
position:
absolute;
left:
5rem;
top:
0;
li{
height:
5rem;
width:
5rem;
display:
block;
float:
left;
p{
width:
5rem;
height:
2.5rem;
line-height:
2.5rem;
text-align:
center;
}
:first-child{
line-height:
3rem;
}
:last-child{
font-size:
1.8rem;
line-height:
2rem;
}
&.first{
position:
fixed;
left:
0;
top:
0;
}
}
.dataClick{
background-color:
#fff;
color:
#5aa5f0;
}
}
.cover{
position:
fixed;
z-index:
1000;
left:
0;
bottom:
0;
right:
0;
top:
0;
}
.loading-wrapper {
position:
fixed;
top:
0;
left:
0;
width:
100%;
height:
100%;
display:
flex;
justify-content:
center;
align-items:
center;
animation-duration:
1s;
animation-fill-mode:
both;
z-index:
1200;
}
.loading-img {
margin:
0
auto;
width:
5rem;
height:
6rem;
background:
url(
'../images/penguin.png'
)
no-repeat;
background-size:
100%
auto;
}
.loading-animate {
margin:
0
auto;
width:
5rem;
height:
2.5rem;
background:
url(
data:../images/gif;base64,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) no-repeat;
background-size:
100%
auto;
}
.rule_show {
background:
#000;
opacity:
1;
width:
100%;
height:
100%;
position:
fixed;
top:
0;
left:
0;
right:
0;
bottom:
0;
z-index:
1;
display:
none;
overflow:
auto;
z-index:
25;
}
.shutDown {
display:
block;
width:
2rem;
height:
2rem;
position:
absolute;
top:
2rem;
right:
1.5rem;
background:
url(
'../images/close.png'
)
no-repeat
right
0;
background-size:
2rem
2rem;
}
.rule_show
h3 {
font-size:
1.5rem;
width:
100%;
text-align:
center;
color:
#fff;
margin:
1rem
0;
border-bottom:
solid
0.2rem
#666;
line-height:
4rem
}
.rule_show
.txt {
width:
90%
!important;
margin:
5rem
auto;
color:
#fff;
font-size:
1rem;
line-height:
2rem
!important;
font-weight:
normal;
word-wrap:
break-word;
}
.rule_show
.txt2 {
width:
100%
!important;
margin:
0
auto;
color:
#fff;
font-size:
1rem;
line-height:
2rem
!important;
font-weight:
normal;
background:
#4c4c4c;
padding:
3rem
0
2rem
0;
text-align:
center;
}
.dn {
display:
none
!important;
}
.listBox{
position:
absolute;
left:
0;
top:
5rem;
z-index:
99;
width:
100%;
background:
#f0eff5;
}
效果图: