#content { justify-content: space-evenly; font-family: 'Alibaba PuHuiTi R'; } #left-box { width: 39%; height: 100%; flex-direction: column; justify-content: space-evenly; letter-spacing: 1px; } #duty-progress, #early-warning-info { width: 100%; height: 45%; } #duty-progress { height: 54%; flex-direction: column; justify-content: space-evenly; } .duty-progress-box { width: 100%; height: 49%; } /* 预警信息 */ #early-warning-box { width: 100%; height: calc(100% - 36px); } /* 值班进度 */ .echarts-box, .duty-info { width: 50%; height: 100%; } .duty-info { flex-direction: column; justify-content: center; } .duty-info div { width: 100%; margin: 0 0 10px 0; align-items: center; justify-content: center; } .duty-info p { font-size: 18px; letter-spacing: 2px; } .duty-info p span { font-weight: bold; } #right-box { width: 60%; height: 100%; } /* 标题 */ .title { width: 100%; height: 36px; line-height: 36px; text-align: center; position: relative; font-size: 20px; font-weight: bold; } .title div:before, .title div:after { position: absolute; background: #666; content: ""; height: 1px; top: 50%; width: 40%; } .title div:before { left: 1px; } .title div:after { right: 1px; } /* 预警信息 start */ .myscroll { width: 100%; height: 98%; margin: 0 auto; /* border: 1px solid #ccc; */ line-height: 26px; font-size: 12px; /* overflow: hidden; */ overflow-y: auto; } .myscroll li { min-height: 120px; /* margin-bottom: 15px; */ justify-content: space-evenly; } .myscroll a { color: #333; text-decoration: none; } .myscroll a:hover { color: #ED5565; text-decoration: underline; } .xh{ width: 9%; height: 100%; justify-content: center; font-size: 16px; } .warnInfo { width: 70%; height: 100%; } .warnInfo p { font-size: 16px; } .handleStatus { width: 20%; height: 100%; align-items: center; justify-content: center; } .handleStatus span { font-size: 16px; padding: 2px 10px; border-radius: 2px; cursor: pointer; } .handleStatus span.handleData { background-color: #D7FCEA; color: #45D991; } .handleStatus span.noHandleData { background-color: #FBEADA; color: #ED9949; } .warnInfo { flex-direction: column; align-items: start; } /* 预警信息 end */ .layui-table-sort { margin-left: 0; }