|
/*格式化样式*/
|
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;}
|
table {border-collapse:collapse;border-spacing:0;}
|
fieldset,img {border:0}
|
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal}
|
ol,ul {list-style:none}
|
caption,th {text-align:left}
|
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal}
|
q:before,q:after {content:''}
|
abbr,acronym { border:0}
|
|
.loop(@i) when(@i <= 60){
|
.fz@{i} {
|
font-size: @i + 0px ;
|
}
|
.mt@{i} {
|
margin-top: @i + 0px ;
|
}
|
.ml@{i} {
|
margin-left: @i + 0px ;
|
}
|
.mr@{i} {
|
margin-right: @i + 0px ;
|
}
|
.mb@{i} {
|
margin-buttom: @i + 0px ;
|
}
|
.loop((@i + 1));
|
}
|
|
|
.appPlas{
|
.loop(2)
|
}
|
|
//公用样式
|
.flex{display:flex}
|
.ju-c{justify-content: center}
|
.ju-sb{justify-content: space-between;}
|
.ju-se{justify-content: space-evenly;}
|
.ju-sa{justify-content: space-around;}
|
.ju-right{justify-content: right;}
|
.warp{flex-wrap: wrap;}
|
.align-c{align-items: center}
|
.flex-y{display:flex;flex-direction:column;}
|
.t-center{text-align: center;}
|
.fw{font-weight:600;}
|
.absolute{position:absolute;}
|
.relative{position:relative;}
|
.hidden{display: none;}
|
.block {display:block;}
|
.cursor{cursor: pointer}
|
.line-clamp2{
|
overflow: hidden;
|
text-overflow: ellipsis;
|
word-break: break-all;
|
display: -webkit-box;
|
-webkit-line-clamp: 2; /*限制在一个块元素显示的文本的行数*/
|
-webkit-box-orient: vertical;
|
}
|
.line-clamp1{
|
overflow: hidden;
|
text-overflow: ellipsis;
|
word-break: break-all;
|
display: -webkit-box;
|
-webkit-line-clamp: 1; /*限制在一个块元素显示的文本的行数*/
|
-webkit-box-orient: vertical;
|
}
|
.color-white{color:white;}
|
.color-green{color:#1DFFFF;}
|
.col-lan{color:#34AFFE}
|
.col-hua{color:#FFD982}
|
.col-lv{color:#28E09A}
|
.col-lv2{color:#03F1EC}
|
.op8{opacity: 0.8;}
|
.title-big-box {
|
max-width: 898px !important;
|
width: 100%;
|
// background:url("../../assets/png/title_big_bg.png")no-repeat !important;
|
background:url("../../assets/newImg/bgtitle.png")no-repeat !important;;
|
background-size: auto 100% !important;
|
|
}
|
|
|
.title-size{
|
width:480px;height:35px;background: linear-gradient(90deg,#033487, rgba(1,52,135,0.00));align-items: center;display: flex;
|
.box-title-r{
|
display: flex;justify-content: space-between;height:35px;align-items: center;color:#fff;padding:0 10px;margin:0 auto;
|
.more-size{width:24px;height:24px;}
|
}
|
}
|
@keyframes mymove {
|
from{left:100%;}
|
to{left:0%;}
|
}
|
@keyframes mytopmove {
|
from{bottom:30%;}
|
to{bottom:100%;}
|
}
|
@keyframes mytopmove1 {
|
from{top:0%;}
|
to{top:100%;}
|
}
|
|
@keyframes myrote {
|
to {
|
transform: rotate(360deg);
|
}
|
}
|
@keyframes myrote1 {
|
to {
|
transform: rotate(-360deg);
|
}
|
}
|
.title-box1{
|
width:100%;
|
height:30px;
|
display:flex;
|
justify-content: space-between;
|
align-items: center;
|
font-size:14px;
|
color:#fff;
|
position:relative;
|
overflow: hidden;
|
.animet{
|
width:480px;
|
height:1px;
|
background:linear-gradient(270deg,rgba(0,220,255,0.00), #00b6ff);
|
border-radius: 5px;
|
animation:mymove 4s linear infinite;
|
position:absolute;
|
bottom:0;
|
}
|
.title-name{
|
padding-left:30px;
|
font-size:16px;
|
font-family: "YouSheBiaoTiHeiT";
|
}
|
.more{
|
cursor: pointer;
|
}
|
img{width:12px;height:12px;}
|
}
|
|
|
.title-bg-image2{
|
background:url("../../assets/newImg/bg-title-box2.png")no-repeat center/cover;
|
max-width: 576px;
|
}
|
.title-bg-image1{
|
max-width: 480px;
|
background:url("../../assets/newImg/bgtitle.png")no-repeat center/cover;
|
}
|
.title-bg-image3{
|
max-width: 898px;
|
background:url("../../assets/newImg/bg_jiubai@2x.png")no-repeat center/cover;
|
}
|
.title-bg-image{
|
max-width: 392px;
|
background:url("../../assets/newImg/bgtitle.png")no-repeat;
|
}
|
.title-bd{
|
width:480px;height:8px;background:url("../../assets/png/bh-d.png")no-repeat center/cover;
|
}
|
.title-bg{
|
width:480px;height:8px;background:url("../../assets/index/clitisx.png")no-repeat center/cover;margin:0 auto;
|
}
|
.title-bu{
|
width:480px;height:20px;background:url("../../assets/png/bh-u.png")no-repeat center/cover;
|
}
|
|
.title-new{
|
width:96%;
|
margin:0 auto;
|
height:32px;
|
display:flex;
|
align-items: center;
|
justify-content: space-between;
|
font-size:16px;
|
color:#fff;
|
.t1{
|
display:flex;
|
align-items: center;
|
.t1s{width:4px;background:#00f4ed;height:16px;}
|
.t1f{color:#fff;font-size:16px;font-family: 'PingFangSC'; font-weight: 500; margin-left:10px;}
|
}
|
.t2{
|
display:flex;
|
align-items: center;
|
font-size:12px;
|
.t2-more{width:12px;height:12px;}
|
}
|
}
|
.title-box{
|
width:100%;
|
max-width: 392px;
|
height:32px;
|
background:url("../../assets/newImg/bgtitle.png")no-repeat;
|
display:flex;
|
align-items: center;
|
font-size:16px;
|
color:#fff;
|
position: relative;
|
background-size: auto 100%;
|
overflow: hidden;
|
.animet{
|
width:480px;
|
height:1px;
|
background:linear-gradient(270deg,rgba(0,220,255,0.00), #00b6ff);
|
border-radius: 5px;
|
animation:mymove 4s linear infinite;
|
position:absolute;
|
bottom:0;
|
}
|
.t1{width:35px;}
|
.t2{display:flex;justify-content: space-between;width:calc(100% - 35px);align-items: center;font-family: "YouSheBiaoTiHeiT";
|
.t3{display:flex;
|
align-items: center;
|
color:#FFDC5F;
|
cursor: pointer;
|
.t3-more{width:12px;height:12px;}
|
}
|
.t4{display:flex;align-items: center;width:40%;padding-right:10px;justify-content: right;
|
.t4-img{width:10px;height:10px;}
|
}
|
}
|
}
|
|
.title-box-center{
|
width:100%;
|
max-width: 446px;
|
height:34px;
|
background:url("../../assets/png/title_bg.png")no-repeat center/cover;
|
display:flex;
|
align-items: center;
|
font-size:14px;
|
color:#fff;
|
background-size: auto 100%;
|
background-position-x: 5px;
|
.t1{width:55px;}
|
.t2{display:flex;width:calc(100% - 55px);align-items: center;
|
.t3{display:flex;
|
align-items: center;
|
font-family: Digital;
|
cursor: pointer;
|
margin-left:20px;
|
.t3-more{width:12px;height:12px;}
|
}
|
.t4{display:flex;align-items: center;width:40%;padding-right:10px;justify-content: right;
|
.t4-img{width:10px;height:10px;}
|
}
|
}
|
|
}
|
//三角形
|
.triangle-right {
|
width: 0;
|
height: 0;
|
border-top: 7px solid transparent;
|
border-right: 5px solid #1483F2;
|
border-bottom: 7px solid transparent;
|
}
|
.triangle-left {
|
width: 0;
|
height: 0;
|
border-top: 7px solid transparent;
|
border-left: 5px solid #1483F2;
|
border-bottom: 7px solid transparent;
|
}
|
.v-center{position:relative;
|
display:flex;
|
width:498px;
|
height: 100%;
|
}
|
.digi{font-family:'Digital';}
|
|
.flex-col{display: flex;justify-content: space-evenly;flex-direction: column;}
|
|
.barIndex{
|
display: flex;
|
align-items: center;
|
width: 84%;
|
height: 24px;
|
padding-right:50px;
|
border: 1px solid;
|
border-image: linear-gradient(270deg, rgba(114, 152, 190, 0.6), rgba(62,95,137,0.00)) 1 1;
|
.el{height: 4px;background: linear-gradient(90deg,rgba(86,103,143,0.00), #51648d);}
|
.el1{height: 4px;background: linear-gradient(90deg,rgba(195,113,86,0.00), #c47359);}
|
.el2{height:4px;background: linear-gradient(90deg,rgba(196,142,91,0.00), #c38b58);}
|
.el3{height: 4px;background: linear-gradient(90deg,rgba(102,120,198,0.00), #697ac6);}
|
.el4{height: 4px;background: linear-gradient(90deg,rgba(86,237,219,0.00), #5decd9);}
|
.wb-el{
|
width: 4px;
|
height: 13px;
|
background: #ffffff;
|
box-shadow: 0px 0px 6px 0px rgba(255,255,255,0.30);
|
}
|
|
}
|
|
|
|
// 地图弹窗的关闭按钮
|
.header-temp {
|
width:30px;
|
}
|
.close-img-size{width:32px; height:32px;margin-right:-25px;}
|
.close-img-size:hover{
|
width:32px;
|
height:32px;
|
margin-right:-25px;
|
content: url("../../assets/map/icon_close_n@2x.png")
|
}
|
|
.bor-red{border:1px solid red;box-sizing: border-box;}
|
//输入框
|
.input-login {
|
background: transparent;
|
border: none;
|
color: #fff;
|
flex: 1;
|
}
|
.input-login:focus {
|
outline: none;
|
}
|
.input-login:-webkit-autofill {
|
transition: background-color 5000s ease-in-out 0s;
|
-webkit-text-fill-color: white !important;
|
}
|
|
|
//下拉菜单
|
|
.dropdown{position:relative;width: 156px;
|
cursor: pointer;
|
height: 40px;
|
line-height: 40px;
|
background: url("../../assets/newImg/top-itle.png")no-repeat center/cover;
|
.detinline{height:40px;line-height:40px;color:white;width:80%;margin:0 auto;text-align: center;
|
.icon-more-s{width:13px;height:10px;}
|
}
|
|
.item-box{width:100%;max-height:200px;overflow-y: scroll;color:#fff;
|
scrollbar-width: none; /* firefox */
|
-ms-overflow-style: none; /* IE 10+ */
|
border: 1px solid #56afe9;
|
z-index: 1;
|
background:rgba(6,32,63,1);
|
.pl20{padding-left:15px;}
|
.item-d-s{
|
height:30px;
|
line-height: 30px;
|
color:#eee
|
}
|
}
|
.item-d-s:hover{background:rgba(255,255,255,0.06);color: #fff;}
|
|
.item-box::-webkit-scrollbar {
|
display: none;
|
}
|
|
}
|
|
|
// 排名
|
.ranking {
|
width: 25px;
|
height: 25px;
|
background: url("../../assets/png/ranking4.png");
|
background-size: 100% 100%;
|
text-align: center;
|
line-height: 25px;
|
}
|
.ranking1 {
|
background: url("../../assets/png/ranking1.png");
|
background-size: 100% 100%;
|
}
|
.ranking2 {
|
background: url("../../assets/png/ranking2.png");
|
background-size: 100% 100%;
|
}
|
.ranking3 {
|
background: url("../../assets/png/ranking3.png");
|
background-size: 100% 100%;
|
}
|
|
.item-center{
|
align-items: center;
|
}
|
