更新 demo/index.css
This commit is contained in:
parent
803292ff5f
commit
a154969dad
471
demo/index.css
471
demo/index.css
|
|
@ -1,232 +1,241 @@
|
||||||
.page {
|
.page {
|
||||||
background-color: rgba(255, 255, 255, 1);
|
background-color: rgba(255, 255, 255, 1);
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 1920px;
|
width: 1920px;
|
||||||
height: 1080px;
|
height: 1080px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.group_1 {
|
.group_1 {
|
||||||
height: 1080px;
|
height: 1080px;
|
||||||
background: url(https://lanhu-oss.lanhuapp.com/SketchPng0e96af0d0232c5137e797f36a507c5d7f5942dbd7ef51a7fd509aa92e5235924) 100% no-repeat;
|
background: url(https://lanhu-oss.lanhuapp.com/SketchPng0e96af0d0232c5137e797f36a507c5d7f5942dbd7ef51a7fd509aa92e5235924) 100% no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
margin-left: 1088px;
|
margin-left: 1088px;
|
||||||
width: 832px;
|
width: 832px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.group_2 {
|
.group_2 {
|
||||||
background-color: rgba(31, 120, 212, 1);
|
background-color: rgba(31, 120, 212, 1);
|
||||||
height: 1080px;
|
height: 1080px;
|
||||||
margin-left: -1088px;
|
margin-left: -1088px;
|
||||||
grid-template-columns: repeat(0, 1fr);
|
grid-template-columns: repeat(0, 1fr);
|
||||||
width: 1920px;
|
width: 1920px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.box_1 {
|
.group_3 {
|
||||||
background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/7bbf00aeec1e4fafb9470ae6ed13a070_mergeImage.png);
|
height: 599px;
|
||||||
height: 1080px;
|
background: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/e020f4f2b53248e19e2ad78d9a45110f_mergeImage.png) 100% no-repeat;
|
||||||
width: 1920px;
|
background-size: 100% 100%;
|
||||||
}
|
width: 952px;
|
||||||
.group_3 {
|
margin: 0 auto;
|
||||||
height: 599px;
|
/* 水平居中 */
|
||||||
background: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/e020f4f2b53248e19e2ad78d9a45110f_mergeImage.png) 100% no-repeat;
|
}
|
||||||
background-size: 100% 100%;
|
.box_1 {
|
||||||
width: 952px;
|
background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/7bbf00aeec1e4fafb9470ae6ed13a070_mergeImage.png);
|
||||||
margin: 240px 0 0 484px;
|
display: flex;
|
||||||
}
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
.image-wrapper_2 {
|
/* 垂直居中 */
|
||||||
width: 153px;
|
align-items: center;
|
||||||
height: 41px;
|
/* 水平居中 */
|
||||||
margin: 35px 0 0 35px;
|
height: 100%;
|
||||||
}
|
/* 确保填满父容器 */
|
||||||
|
width: 100%;
|
||||||
.image_1 {
|
box-sizing: border-box;
|
||||||
width: 153px;
|
}
|
||||||
height: 41px;
|
|
||||||
}
|
.image-wrapper_2 {
|
||||||
|
width: 153px;
|
||||||
.group_5 {
|
height: 41px;
|
||||||
width: 209px;
|
margin: 35px 0 0 35px;
|
||||||
height: 90px;
|
}
|
||||||
margin: 4px 0 0 610px;
|
|
||||||
}
|
.image_1 {
|
||||||
|
width: 153px;
|
||||||
.text-wrapper_1 {
|
height: 41px;
|
||||||
width: 209px;
|
}
|
||||||
height: 90px;
|
|
||||||
overflow-wrap: break-word;
|
.group_5 {
|
||||||
font-size: 0;
|
width: 209px;
|
||||||
font-family: PingFangSC-Semibold;
|
height: 90px;
|
||||||
font-weight: 600;
|
margin: 4px 0 0 610px;
|
||||||
text-align: left;
|
}
|
||||||
line-height: 50px;
|
|
||||||
}
|
.text-wrapper_1 {
|
||||||
|
width: 209px;
|
||||||
.text_1 {
|
height: 90px;
|
||||||
width: 209px;
|
overflow-wrap: break-word;
|
||||||
height: 90px;
|
font-size: 0;
|
||||||
overflow-wrap: break-word;
|
font-family: PingFangSC-Semibold;
|
||||||
color: rgba(0, 0, 0, 0.86);
|
font-weight: 600;
|
||||||
font-size: 36px;
|
text-align: left;
|
||||||
font-family: PingFangSC-Semibold;
|
line-height: 50px;
|
||||||
font-weight: 600;
|
}
|
||||||
text-align: left;
|
|
||||||
line-height: 50px;
|
.text_1 {
|
||||||
}
|
width: 209px;
|
||||||
|
height: 90px;
|
||||||
.paragraph_1 {
|
overflow-wrap: break-word;
|
||||||
width: 209px;
|
color: rgba(0, 0, 0, 0.86);
|
||||||
height: 90px;
|
font-size: 36px;
|
||||||
overflow-wrap: break-word;
|
font-family: PingFangSC-Semibold;
|
||||||
color: rgba(196, 196, 196, 0.86);
|
font-weight: 600;
|
||||||
font-size: 42px;
|
text-align: left;
|
||||||
font-family: PingFangSC-Semibold;
|
line-height: 50px;
|
||||||
font-weight: 600;
|
}
|
||||||
text-align: left;
|
|
||||||
line-height: 50px;
|
.paragraph_1 {
|
||||||
}
|
width: 209px;
|
||||||
|
height: 90px;
|
||||||
.text_2 {
|
overflow-wrap: break-word;
|
||||||
width: 209px;
|
color: rgba(196, 196, 196, 0.86);
|
||||||
height: 90px;
|
font-size: 42px;
|
||||||
overflow-wrap: break-word;
|
font-family: PingFangSC-Semibold;
|
||||||
color: rgba(0, 0, 0, 0.46);
|
font-weight: 600;
|
||||||
font-size: 28px;
|
text-align: left;
|
||||||
font-family: PingFangSC-Medium;
|
line-height: 50px;
|
||||||
font-weight: 500;
|
}
|
||||||
text-align: left;
|
|
||||||
line-height: 50px;
|
.text_2 {
|
||||||
}
|
width: 209px;
|
||||||
|
height: 90px;
|
||||||
.group_6 {
|
overflow-wrap: break-word;
|
||||||
width: 159px;
|
color: rgba(0, 0, 0, 0.46);
|
||||||
height: 25px;
|
font-size: 28px;
|
||||||
margin: 69px 0 0 538px;
|
font-family: PingFangSC-Medium;
|
||||||
}
|
font-weight: 500;
|
||||||
|
text-align: left;
|
||||||
.image-text_3 {
|
line-height: 50px;
|
||||||
width: 159px;
|
}
|
||||||
height: 25px;
|
|
||||||
}
|
.group_6 {
|
||||||
|
width: 159px;
|
||||||
.thumbnail_1 {
|
height: 25px;
|
||||||
width: 17px;
|
margin: 69px 0 0 538px;
|
||||||
height: 18px;
|
}
|
||||||
margin-top: 4px;
|
|
||||||
}
|
.image-text_3 {
|
||||||
|
width: 159px;
|
||||||
.text-group_1 {
|
height: 25px;
|
||||||
width: 126px;
|
}
|
||||||
height: 25px;
|
|
||||||
overflow-wrap: break-word;
|
.thumbnail_1 {
|
||||||
color: rgba(0, 0, 0, 0.86);
|
width: 17px;
|
||||||
font-size: 18px;
|
height: 18px;
|
||||||
font-family: PingFangSC-Regular;
|
margin-top: 4px;
|
||||||
font-weight: normal;
|
}
|
||||||
text-align: left;
|
|
||||||
white-space: nowrap;
|
.text-group_1 {
|
||||||
line-height: 25px;
|
width: 126px;
|
||||||
}
|
height: 25px;
|
||||||
|
overflow-wrap: break-word;
|
||||||
.group_7 {
|
color: rgba(0, 0, 0, 0.86);
|
||||||
width: 356px;
|
font-size: 18px;
|
||||||
height: 2px;
|
font-family: PingFangSC-Regular;
|
||||||
margin: 10px 0 0 536px;
|
font-weight: normal;
|
||||||
}
|
text-align: left;
|
||||||
|
white-space: nowrap;
|
||||||
.section_1 {
|
line-height: 25px;
|
||||||
background-color: rgba(0, 0, 0, 0.05);
|
}
|
||||||
border-radius: 8px;
|
|
||||||
width: 356px;
|
.group_7 {
|
||||||
height: 2px;
|
width: 356px;
|
||||||
}
|
height: 2px;
|
||||||
|
margin: 10px 0 0 536px;
|
||||||
.group_8 {
|
}
|
||||||
width: 140px;
|
|
||||||
height: 25px;
|
.section_1 {
|
||||||
margin: 54px 0 0 539px;
|
background-color: rgba(0, 0, 0, 0.05);
|
||||||
}
|
border-radius: 8px;
|
||||||
|
width: 356px;
|
||||||
.image-text_4 {
|
height: 2px;
|
||||||
width: 140px;
|
}
|
||||||
height: 25px;
|
|
||||||
}
|
.group_8 {
|
||||||
|
width: 140px;
|
||||||
.thumbnail_2 {
|
height: 25px;
|
||||||
width: 18px;
|
margin: 54px 0 0 539px;
|
||||||
height: 18px;
|
}
|
||||||
margin-top: 4px;
|
|
||||||
}
|
.image-text_4 {
|
||||||
|
width: 140px;
|
||||||
.text-group_2 {
|
height: 25px;
|
||||||
width: 108px;
|
}
|
||||||
height: 25px;
|
|
||||||
overflow-wrap: break-word;
|
.thumbnail_2 {
|
||||||
color: rgba(0, 0, 0, 0.86);
|
width: 18px;
|
||||||
font-size: 18px;
|
height: 18px;
|
||||||
font-family: PingFangSC-Regular;
|
margin-top: 4px;
|
||||||
font-weight: normal;
|
}
|
||||||
text-align: left;
|
|
||||||
white-space: nowrap;
|
.text-group_2 {
|
||||||
line-height: 25px;
|
width: 108px;
|
||||||
}
|
height: 25px;
|
||||||
|
overflow-wrap: break-word;
|
||||||
.group_9 {
|
color: rgba(0, 0, 0, 0.86);
|
||||||
width: 356px;
|
font-size: 18px;
|
||||||
height: 2px;
|
font-family: PingFangSC-Regular;
|
||||||
margin: 10px 0 0 536px;
|
font-weight: normal;
|
||||||
}
|
text-align: left;
|
||||||
|
white-space: nowrap;
|
||||||
.group_4 {
|
line-height: 25px;
|
||||||
background-color: rgba(0, 0, 0, 0.05);
|
}
|
||||||
border-radius: 8px;
|
|
||||||
width: 356px;
|
.group_9 {
|
||||||
height: 2px;
|
width: 356px;
|
||||||
}
|
height: 2px;
|
||||||
|
margin: 10px 0 0 536px;
|
||||||
.text-wrapper_4 {
|
}
|
||||||
width: 72px;
|
|
||||||
height: 25px;
|
.group_4 {
|
||||||
margin: 14px 0 0 820px;
|
background-color: rgba(0, 0, 0, 0.05);
|
||||||
}
|
border-radius: 8px;
|
||||||
|
width: 356px;
|
||||||
.text_3 {
|
height: 2px;
|
||||||
width: 72px;
|
}
|
||||||
height: 25px;
|
|
||||||
overflow-wrap: break-word;
|
.text-wrapper_4 {
|
||||||
color: rgba(0, 0, 0, 0.86);
|
width: 72px;
|
||||||
font-size: 18px;
|
height: 25px;
|
||||||
font-family: PingFangSC-Regular;
|
margin: 14px 0 0 820px;
|
||||||
font-weight: normal;
|
}
|
||||||
text-align: left;
|
|
||||||
white-space: nowrap;
|
.text_3 {
|
||||||
line-height: 25px;
|
width: 72px;
|
||||||
}
|
height: 25px;
|
||||||
|
overflow-wrap: break-word;
|
||||||
.group_10 {
|
color: rgba(0, 0, 0, 0.86);
|
||||||
width: 355px;
|
font-size: 18px;
|
||||||
height: 80px;
|
font-family: PingFangSC-Regular;
|
||||||
margin: 46px 0 67px 536px;
|
font-weight: normal;
|
||||||
}
|
text-align: left;
|
||||||
|
white-space: nowrap;
|
||||||
.text-wrapper_3 {
|
line-height: 25px;
|
||||||
background-color: rgba(0, 91, 247, 1);
|
}
|
||||||
border-radius: 8px;
|
|
||||||
height: 80px;
|
.group_10 {
|
||||||
width: 355px;
|
width: 355px;
|
||||||
}
|
height: 80px;
|
||||||
|
margin: 46px 0 67px 536px;
|
||||||
.text_4 {
|
}
|
||||||
width: 84px;
|
|
||||||
height: 50px;
|
.text-wrapper_3 {
|
||||||
overflow-wrap: break-word;
|
background-color: rgba(0, 91, 247, 1);
|
||||||
color: rgba(255, 255, 255, 0.86);
|
border-radius: 8px;
|
||||||
font-size: 36px;
|
height: 80px;
|
||||||
font-family: PingFangSC-Regular;
|
width: 355px;
|
||||||
font-weight: normal;
|
}
|
||||||
text-align: left;
|
|
||||||
white-space: nowrap;
|
.text_4 {
|
||||||
line-height: 50px;
|
width: 84px;
|
||||||
margin: 15px 0 0 141px;
|
height: 50px;
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
color: rgba(255, 255, 255, 0.86);
|
||||||
|
font-size: 36px;
|
||||||
|
font-family: PingFangSC-Regular;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: left;
|
||||||
|
white-space: nowrap;
|
||||||
|
line-height: 50px;
|
||||||
|
margin: 15px 0 0 141px;
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue
Block a user