112 lines
3.1 KiB
SCSS
112 lines
3.1 KiB
SCSS
.allBox {
|
|
width: 1920px;
|
|
height: 3240px;
|
|
margin: 0 auto;
|
|
background: url("~@/assets/images/largeScreen/all-bg.png") no-repeat;
|
|
background-size: 100%;
|
|
position: relative;
|
|
}
|
|
ul.bigBox {
|
|
display: flex;
|
|
justify-content: center;
|
|
flex-wrap: wrap;
|
|
li.mainBox {
|
|
width: 600px;
|
|
height: 1000px;
|
|
margin: 15px;
|
|
background: url("~@/assets/images/largeScreen/mainBox-bg.png") no-repeat;
|
|
background-size: auto 100%;
|
|
background-position: center bottom;
|
|
.title {
|
|
height: 34px;
|
|
line-height: 34px;
|
|
background: url("~@/assets/images/largeScreen/mainBox-title.png")
|
|
no-repeat;
|
|
background-size: 100% 100%;
|
|
padding: 0 0 0 20px;
|
|
span {
|
|
background: -webkit-linear-gradient(#dbf9ff, #a9f0ff);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
.contentBox {
|
|
height: 966px;
|
|
border: 1px solid transparent;
|
|
display: flex;
|
|
justify-content: space-evenly;
|
|
flex-direction: column;
|
|
.dataBox {
|
|
margin: 0 auto;
|
|
width: 560px;
|
|
min-height: 40px;
|
|
background: url("~@/assets/images/largeScreen/dataBox-line-bg.png")
|
|
no-repeat;
|
|
background-position: center bottom;
|
|
overflow: hidden;
|
|
padding: 0 0 15px;
|
|
.countBox {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
height: 85px;
|
|
background: url("~@/assets/images/largeScreen/tongji3-jjrzs.png")
|
|
no-repeat left top;
|
|
.countTitle {
|
|
line-height: 70px;
|
|
font-size: 32px;
|
|
padding: 0 0 0 84px;
|
|
span {
|
|
background: -webkit-linear-gradient(#ffffff, #75e8ff);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
.count {
|
|
line-height: 70px;
|
|
font-size: 24px;
|
|
.numb {
|
|
font-size: 48px;
|
|
display: inline-block;
|
|
padding: 0 15px 0 0;
|
|
text-shadow: 0 0 5px #2ab9d6, 0 0 20px #2ab9d6, 0 0 30px #2ab9d6;
|
|
}
|
|
}
|
|
}
|
|
ul {
|
|
li {
|
|
height: 70px;
|
|
line-height: 70px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
.liTitle {
|
|
font-size: 32px;
|
|
span {
|
|
background: -webkit-linear-gradient(#ffffff, #75e8ff);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
font-weight: 500;
|
|
}
|
|
.rankNumb {
|
|
display: inline-block;
|
|
padding: 0 10px 0 0;
|
|
}
|
|
}
|
|
.count {
|
|
line-height: 70px;
|
|
font-size: 24px;
|
|
.numb {
|
|
font-size: 48px;
|
|
display: inline-block;
|
|
padding: 0 15px 0 0;
|
|
text-shadow: 0 0 5px #2ab9d6, 0 0 20px #2ab9d6, 0 0 30px #2ab9d6;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|