html { width: 100%; height: 100%; margin: 0; } body { margin: 0; font-family: 'Alibaba PuHuiTi R'; height: 98%; } .layout { display: flex; justify-content: center; align-items: center; } #main-box { width: 100%; height: 100%; padding: 0 1% 0 1%; box-sizing: border-box; background-color: #fff; border-radius: 5px; } #pro-detail-box { width: 100%; height: 80px; align-items: center; justify-content: space-between; } #pro-basic-detail-box { width: 100%; height: 70px; align-items: center; justify-content: space-between; padding: 0 0 0 4%; box-sizing: border-box; } .basic-detail { flex-direction: column; width: 12%; height: 100%; align-items: start; justify-content: space-evenly; } .basic-detail:nth-child(8) { width: 28%; } #data-box { width: 100%; height: calc(100% - 160px); } #gx-num-box { width: 100%; height: 40px; justify-content: space-between; } .num-box { width: 10%; height: 100%; /*margin-right: 1%;*/ justify-content: space-around; } .num-box > p:nth-child(1) { font-weight: bold; font-size: 18px; } .num-box > p:nth-child(2) { font-size: 18px; } .num-box:nth-child(1) > p:nth-child(2) { color: #666; } .num-box:nth-child(2) > p:nth-child(2) { color: #f0f054; } .num-box:nth-child(3) > p:nth-child(2) { color: #19be6b; } .num-box:nth-child(4) > p:nth-child(2) { color: #66b1ff; } .num-box:nth-child(5) > p:nth-child(2) { color: #ff9900; } .num-box:nth-child(6) > p:nth-child(2) { color: #f56c6c; } .num-box:nth-child(7) > p:nth-child(2) { color: #8400ff; } .num-box:nth-child(8) > p:nth-child(2) { color: #00bfbf; } .num-box:nth-child(9) > p:nth-child(2) { color: #13227a; } .num-box:nth-child(10) > p:nth-child(2) { color: #1afa29; } .layui-tab-brief > .layui-tab-title .layui-this { color: #409eff; } .oper-info { width: 100%; height: auto; } .oper-info > div { margin: 10px 0; } .oper-info > div:nth-child(1) { width: 7%; height: 100% } .oper-info > div:nth-child(2) { width: 73%; height: 100% } .oper-info > div:nth-child(3) { width: 20%; height: 100% } .user-oper { flex-direction: column; } .table-box { width: 99%; padding: 0 0.5%; height: calc(100% - 240px); } .update-form { width: 100%; height: 100px; } .btn-box { width: 100%; height: 60px; margin-top: 10px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; } .save { background-color: #00377A; } .tower-box { width: 100%; max-height: calc(100% - 200px); background-color: #F2F2F2FF; margin-bottom: 10px; align-items: start; justify-content: start; flex-wrap: wrap; overflow-y: auto; } .tower-info { min-width: 70px; height: 40px; margin: 10px; border-radius: 6px; border:1px solid #E4E4E4FF; background-color: #fff; cursor: pointer; } .tower-info p{ padding: 0 5px; } .biddenChoose{ background-color: #ffff00; } .choose{ color: #409eff; font-weight: bold; border:1px solid #409eff; background-color:rgb(160, 207, 255,0.2); } .layui-tab-brief > .layui-tab-more li.layui-this:after, .layui-tab-brief > .layui-tab-title .layui-this:after { border-bottom: 2px solid #409eff; } .layui-tab .layui-tab-title li { font-size: 16px; font-weight: bold; } a { color: #428bca; text-decoration: none; } a:hover, a:focus { color: #2a6496; text-decoration: underline; } .layui-tab-item { height: 100%; }