55 lines
1.1 KiB
CSS
55 lines
1.1 KiB
CSS
.main-container {
|
|
height: 1px;
|
|
flex: 1;
|
|
/* background: #ccc4; */
|
|
display: grid;
|
|
grid-template-columns: 626px 576px 580px 626px 626px 450px 626px;
|
|
grid-template-rows: 600px 306px;
|
|
gap: 20px;
|
|
grid-template-areas:
|
|
'left main main main main main right'
|
|
'left bottom1 bottom2 bottom3 bottom4 bottom5 right';
|
|
place-content: end center;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.main-center {
|
|
grid-area: main;
|
|
background: url(../images/3d.png) 100% 80% / contain no-repeat;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.left {
|
|
grid-area: left;
|
|
}
|
|
|
|
.bottom-1 {
|
|
grid-area: bottom1;
|
|
background: url('../images/tongji-bg.png') 100% / contain no-repeat;
|
|
}
|
|
|
|
.bottom-2 {
|
|
grid-area: bottom2;
|
|
background: url('../images/fenlei-bg.png') 100% / contain no-repeat;
|
|
}
|
|
|
|
.bottom-3 {
|
|
grid-area: bottom3;
|
|
background: url('../images/gas-bg.png') 100% / contain no-repeat;
|
|
}
|
|
|
|
.bottom-4 {
|
|
grid-area: bottom4;
|
|
background: url('../images/gas-bg.png') 100% / contain no-repeat;
|
|
}
|
|
|
|
.bottom-5 {
|
|
grid-area: bottom5;
|
|
background: url('../images/spec-bg.png') 100% / contain no-repeat;
|
|
}
|
|
|
|
.right {
|
|
grid-area: right;
|
|
}
|