/* 公共初始化样式 */ html { width: 100%; height: 100%; font-size: 16px; font-family: "微软雅黑"; color: rgb(255, 255, 255); } body { height: 100%; width: 100%; -webkit-text-size-adjust: none; background: url(../img/background.png); background-size: 100% 100%; background-repeat: no-repeat; /*overflow-x: hidden;*/ /* background: -webkit-radial-gradient(circle, #12266a, #000221); */ /* Safari 5.1 - 6.0 */ /* background: -o-radial-gradient(circle, #12266a, #000221); */ /* Opera 11.6 - 12.0 */ /* background: -moz-radial-gradient(circle, #12266a, #000221); */ /* Firefox 3.6 - 15 */ /* background: radial-gradient(circle, #12266a, #000221); */ /* 标准的语法(必须放在最后) */ } .head { /* display: flex; */ width: 100%; height: 9.5%; } .head-left { float: left; margin-top: 1.5%; width: 25.5%; color: rgb(42, 167, 211); } .head-home-img { float: left; margin-left: 2.5rem; } .head-home-img>img{ width: 1.875rem; height: 1.875rem; } .head-date { float: left; margin-left: 2.1rem; font-size: 1.25rem; line-height: 1.875rem; } .head-center { float: left; margin-left: 0.7%; margin-top: 0.7%; width: 45.4%; text-align: center; } .head-center-title { font-size: 2.875rem; font-family: "黑体"; background: linear-gradient(to right, rgb(0, 155, 255), rgb(0, 234, 255), rgb(1, 173, 255)); -webkit-background-clip: text; color: transparent; } .head-right { float: left; margin-left: 0.7%; margin-top: 1.5%; width: 25.8%; text-align: right; } .main { display: flex; width: 100%; height: 88%; } .main-left { display: flex; flex: 1; flex-direction: column; padding-left: 0.78%; } .main-left-1{ flex: 1; } .main-left-2{ flex: 1; } .main-left-3{ flex: 1; } .main-left-4{ flex: 1; } .main-title{ width: 97%; height: 2.5rem; padding-left: 2.9%; background: linear-gradient(to right, rgba(6, 29, 139, 1), rgba(6, 29, 139, 0.3)); line-height: 2.5rem; font-size: 1.375rem; color: rgb(1, 178, 255); } .main-content{ width: 100%; height: 10.5rem; } .main-center { display: flex; flex: 1.76; flex-direction: column; padding: 0 0.83% ; } .main-center-1{ flex: 1; } .main-center-2{ flex: 0.41; } .main-center-3{ flex: 0.51; } .main-right { display: flex; flex: 1; flex-direction: column; padding-right: 0.88%; } .main-right-1 { flex: 1; } .main-right-2 { flex: 1; } .main-right-3 { flex: 1; } .main-right-4 { flex: 1; }