body { padding: 0px; margin: 0px; width: 100vw; overflow-y: auto; overflow-x: auto; } .echart { width: 1334px; height: 1080px; } .data { width: 586px; height: 1080px; box-sizing: border-box; padding: 20px 18px; /* CSS 绘制深蓝渐变背景,不再使用 right.png(背景图上的“本月保养计划/本周任务”标题已不适用) */ background: linear-gradient(180deg, #07344a 0%, #05263b 60%, #041d2c 100%); color: #ffffff; } /* 右侧分为上下两块:上-当前问题设备,下-近期保养计划 */ .data .panel { box-sizing: border-box; border: 1px solid rgba(36, 149, 191, 0.45); border-radius: 8px; background: rgba(10, 60, 90, 0.25); padding: 10px 12px; overflow: hidden; } .data .panel-problem { height: 480px; } .data .panel-plan { height: 520px; margin-top: 18px; } .data .panel-name { font-size: 22px; font-weight: bold; letter-spacing: 4px; text-align: center; margin-bottom: 8px; } /* 中间亮两边暗的渐变标题条 */ .data .bar-title { height: 30px; line-height: 30px; text-align: center; font-size: 15px; background: linear-gradient(90deg, rgba(23, 111, 158, 0) 0%, rgba(23, 111, 158, 0.8) 50%, rgba(23, 111, 158, 0) 100%); } .data .sum-line { font-size: 16px; text-align: center; margin: 6px 0; } .data .sum-line span { margin: 0 8px; } .data .item { display: flex; align-items: center; padding-left: 10px; margin-bottom: 6px; font-size: 14px; } .data .item > span { line-height: 26px; text-align: center; } .data .item > span:nth-child(1) { flex: 2; } .data .item > span:nth-child(2) { flex: 4; /* 溢出隐藏 */ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 6px; } .data .item > span:nth-child(3) { flex: 3; } .data .title { color: #2495bf; } /* 滚动列表容器:liMarquee 需要确定高度 */ .data #problemList { height: 370px; } .data #planList { height: 350px; } .title-icon { position: absolute; top: 135px; left: 24%; color: black; z-index: 10000; } .title-icon span:nth-child(1) { padding-left: 22px; background: url("blue.png") no-repeat 5px 5px; } .title-icon span:nth-child(2) { padding-left: 22px; background: url("yellow.png") no-repeat 5px 5px; } .title-icon span:nth-child(3) { padding-left: 22px; background: url("red.png") no-repeat 5px 5px; }