From 6876084ffc4a01c1eca6a609dec8c176efc59aae Mon Sep 17 00:00:00 2001
From: zhang <zc857179121@qq.com>
Date: 星期四, 22 一月 2026 15:16:45 +0800
Subject: [PATCH] 1
---
zy-acs-cv/src/main/webapp/views/monitor/css/monitor.css | 123 ++++++++++++++++++++++++++++++++++-------
1 files changed, 102 insertions(+), 21 deletions(-)
diff --git a/zy-acs-cv/src/main/webapp/views/monitor/css/monitor.css b/zy-acs-cv/src/main/webapp/views/monitor/css/monitor.css
index 0091392..59860d4 100644
--- a/zy-acs-cv/src/main/webapp/views/monitor/css/monitor.css
+++ b/zy-acs-cv/src/main/webapp/views/monitor/css/monitor.css
@@ -1,4 +1,4 @@
-*{
+* {
margin: 0;
padding: 0;
color: #f2f9ff;
@@ -7,29 +7,32 @@
line-height: 1.5;
box-sizing: border-box;
}
-html{
+
+html {
height: 100%;
overflow: hidden;
}
-body{
+
+body {
height: 100%;
}
body.monitor-bg {
background-image: url("../img/background.png");
background-repeat: no-repeat;
- background-size:100% 100%;
- background-attachment:fixed;
+ background-size: 100% 100%;
+ background-attachment: fixed;
}
/*澶撮儴*/
-.header{
+.header {
position: relative;
height: 10%;
width: 100%;
z-index: 999;
}
-.title{
+
+.title {
position: absolute;
padding-top: 1px;
margin-top: 1%;
@@ -38,12 +41,13 @@
font-size: 40px;
font-weight: bold;
letter-spacing: 2px;
- transform: scale(1,0.9);
+ transform: scale(1, 0.9);
height: 77%;
width: 30%;
overflow: hidden;
text-overflow: ellipsis;
}
+
.button-left {
position: absolute;
margin-left: 21.4%;
@@ -58,6 +62,7 @@
transform: scaleX(-1);
filter: FlipH;
}
+
.button-right {
position: absolute;
margin-left: 65.1%;
@@ -67,6 +72,7 @@
background-image: url('../img/right.png');
background-size: 100% 100%;
}
+
.time-tools {
position: absolute;
margin-left: 80%;
@@ -77,9 +83,10 @@
}
/*涓讳綋*/
-.container{
+.container {
height: 90%;
}
+
.container-element-side {
float: left;
width: 24%;
@@ -87,6 +94,7 @@
padding: 1%;
box-sizing: border-box;
}
+
.container-side-box {
position: relative;
height: 100%;
@@ -102,9 +110,11 @@
font-size: xx-small;
color: #999;
}
+
.introduce {
height: 30%;
}
+
.introduce-content {
text-indent: 2em;
margin-top: 13px;
@@ -115,19 +125,24 @@
font-size: x-small;
opacity: 0.7;
}
+
/*宸︿腑*/
.charge-info {
height: 60%;
}
+
.info-header {
height: 15%;
}
+
.info-header h6 {
letter-spacing: 3px;
}
+
.charge-info-elem {
height: 20%;
}
+
.charge-info-elem img {
display: inline-block;
height: 100%;
@@ -135,23 +150,27 @@
vertical-align: middle;
padding: 10px 25px 10px 5px;
}
+
.info-detail {
display: inline-block;
height: 100%;
width: 65%;
vertical-align: middle
}
+
.real-data {
width: 100%;
height: 60%;
position: relative;
}
+
.real-data .count {
position: absolute;
left: 0%;
bottom: 0;
font-size: x-large;
}
+
.real-data .unit {
position: absolute;
right: 0;
@@ -159,12 +178,14 @@
font-size: x-small;
opacity: 0.7;
}
+
.content {
width: 100%;
height: 40%;
font-size: x-small;
opacity: 0.7;
}
+
/*宸︿笅*/
.footer {
position: relative;
@@ -172,17 +193,19 @@
height: 10%;
text-align: center;
}
+
.footer span {
position: absolute;
left: 18%;
top: 50%;
- transform:translateY(-50%);
- -webkit-transform:translateY(-50%); /*鍏煎-webkit-寮曟搸娴忚鍣�*/
- -moz-transform:translateY(-50%); /*鍏煎-moz-寮曟搸娴忚鍣�*/
+ transform: translateY(-50%);
+ -webkit-transform: translateY(-50%); /*鍏煎-webkit-寮曟搸娴忚鍣�*/
+ -moz-transform: translateY(-50%); /*鍏煎-moz-寮曟搸娴忚鍣�*/
overflow: hidden;
text-overflow: ellipsis;
- white-space:nowrap;
+ white-space: nowrap;
}
+
.footer img {
position: absolute;
right: 0;
@@ -190,6 +213,7 @@
height: 100%;
width: auto;
}
+
/* 涓� */
.container-element-middle {
float: left;
@@ -198,7 +222,8 @@
padding: 1.2% 1% 1.5% 1%;
box-sizing: border-box;
}
-.map-board{
+
+.map-board {
height: 100%;
width: 100%;
border: 1px solid rgba(20, 80, 136, 1);
@@ -214,19 +239,23 @@
height: 30%;
margin-bottom: 5%;
}
+
.line-chart-title {
height: 30%;
}
+
.order-report {
position: relative;
height: 50%;
}
+
.order-report .order-report-left {
letter-spacing: 2px;
position: absolute;
left: 0;
bottom: 0;
}
+
.order-report .order-report-right {
letter-spacing: 2px;
font-size: x-large;
@@ -235,10 +264,12 @@
right: 0;
bottom: 0;
}
+
.order-report-english {
position: relative;
height: 50%;
}
+
.order-report-english .order-report-left {
letter-spacing: 2px;
color: #999;
@@ -251,6 +282,7 @@
left: 0;
top: 0;
}
+
.order-report-english .order-report-right {
font-size: xx-small;
color: #999;
@@ -262,27 +294,33 @@
right: 0;
top: 0;
}
+
#line-charts {
height: 70%;
}
+
/*鍙充腑*/
.container-side-box.right-middle {
height: 50%;
margin-bottom: 5%;
}
+
.top-header {
height: 20%;
}
+
.income-date {
position: relative;
height: 50%;
}
+
.income-date .income-date-left {
letter-spacing: 2px;
position: absolute;
left: 0;
bottom: 0;
}
+
.income-date .income-date-right {
letter-spacing: 2px;
font-size: large;
@@ -291,10 +329,12 @@
right: 0;
bottom: 0;
}
+
.income-date-english {
position: relative;
height: 50%;
}
+
.income-date-english .income-date-left {
letter-spacing: 2px;
color: #999;
@@ -307,6 +347,7 @@
left: 0;
top: 0;
}
+
.income-date-english .income-date-right {
font-size: xx-small;
color: #999;
@@ -322,6 +363,7 @@
.top-main {
height: 40%;
}
+
#pie-charts {
height: 100%;
}
@@ -329,26 +371,32 @@
.top-footer {
height: 40%;
}
+
.top-footer-elem {
float: left;
width: 33.33%;
height: 100%;
}
+
.elem-header {
height: 60%;
background-repeat: no-repeat;
background-position: 45% 50%;
background-size: 50% auto;
}
+
#elem-header-first {
background-image: url("../img/g1.png");
}
+
#elem-header-second {
background-image: url("../img/f1.png");
}
+
#elem-header-third {
background-image: url("../img/e1.png");
}
+
.elem-main {
height: 20%;
text-align: center;
@@ -356,28 +404,34 @@
opacity: 0.7;
padding: 4px 0;
}
+
.elem-footer {
height: 20%;
text-align: center;
letter-spacing: 2px;
}
+
/*鍙充笅*/
.container-side-box.right-bottom {
height: 15%;
}
+
.progress-bar {
height: 60%;
}
+
.usage-rate {
position: relative;
height: 50%;
}
+
.usage-rate .usage-rate-left {
letter-spacing: 2px;
position: absolute;
left: 0;
bottom: 0;
}
+
.usage-rate .usage-rate-right {
letter-spacing: 2px;
font-size: large;
@@ -386,14 +440,17 @@
right: 0;
bottom: 0;
}
+
.usage-rate .usage-rate-right span {
letter-spacing: 2px;
font-size: large;
}
+
.usage-rate-english {
position: relative;
height: 50%;
}
+
.usage-rate-english .usage-rate-left {
letter-spacing: 2px;
color: #999;
@@ -406,6 +463,7 @@
left: 0;
top: 0;
}
+
.usage-rate-english .usage-rate-right {
font-size: xx-small;
color: #999;
@@ -417,10 +475,12 @@
right: 0;
top: 0;
}
+
.progress-bar-modal {
height: 30%;
padding-top: 1%;
}
+
.bar-container {
width: 70%;
height: 100%;
@@ -428,23 +488,26 @@
vertical-align: middle;
display: inline-block;
}
+
.bar-proportion {
width: 60%;
height: 100%;
background-color: #e77b2c;
position: relative;
}
+
.bar-proportion span {
font-size: xx-small;
position: absolute;
right: 5%;
top: 45%;
- transform:translateY(-50%);
- -webkit-transform:translateY(-50%); /*鍏煎-webkit-寮曟搸娴忚鍣�*/
- -moz-transform:translateY(-50%); /*鍏煎-moz-寮曟搸娴忚鍣�*/
+ transform: translateY(-50%);
+ -webkit-transform: translateY(-50%); /*鍏煎-webkit-寮曟搸娴忚鍣�*/
+ -moz-transform: translateY(-50%); /*鍏煎-moz-寮曟搸娴忚鍣�*/
opacity: 0.8;
}
-.bar-container-count, .bar-container-count span {
+
+.bar-container-count, .bar-container-count span {
float: right;
color: #e77b2c;
vertical-align: middle;
@@ -457,6 +520,7 @@
width: 5px;
height: 5px;
}
+
.image-border1 {
top: 0;
left: 0;
@@ -464,18 +528,21 @@
border-top: 2px solid #31c4c4;
/*transform: scale(0.5)*/
}
+
.image-border2 {
top: 0;
right: 0;
border-right: 2px solid #31c4c4;
border-top: 2px solid #31c4c4;
}
+
.image-border3 {
bottom: 0;
left: 0;
border-bottom: 2px solid #31c4c4;
border-left: 2px solid #31c4c4;
}
+
.image-border4 {
bottom: 0;
right: 0;
@@ -484,14 +551,16 @@
}
/*鍦板浘*/
-.anchorBL img{
+.anchorBL img {
display: none;
}
+
.BMap_cpyCtrl.BMap_noprint.anchorBL {
display: none;
}
-.ec-extension-bmap{
- border-radius:15px;
+
+.ec-extension-bmap {
+ border-radius: 15px;
}
/*閬僵*/
@@ -505,6 +574,7 @@
z-index: 1;
display: none;
}
+
#closeBtn {
font-size: large;
float: right;
@@ -515,10 +585,12 @@
outline: none;
cursor: pointer;
}
+
#closeBtn:hover {
background-color: white;
color: black;
}
+
#detail-modal ul {
position: absolute;
top: 20%;
@@ -526,14 +598,17 @@
transform: translate(-50%, 0);
list-style-type: none;
}
+
#detail-modal li {
font-size: large;
padding: 20px;
}
+
.animationTop {
-webkit-animation: animationTop 0.4s;
animation: animationTop 0.4s;
}
+
@-webkit-keyframes animationTop {
from {
top: -500px;
@@ -544,6 +619,7 @@
opacity: 1;
}
}
+
@keyframes animationTop {
from {
top: -500px;
@@ -558,18 +634,23 @@
.item-img {
background-size: 100% 100%;
}
+
#img-1 {
background-image: url(../img/banner/banner1.jpg);
}
+
#img-2 {
background-image: url(../img/banner/banner2.jpg);
}
+
#img-3 {
background-image: url(../img/banner/banner3.jpg);
}
+
#img-4 {
background-image: url(../img/banner/banner4.jpg);
}
+
#img-5 {
background-image: url(../img/banner/banner5.jpg);
}
\ No newline at end of file
--
Gitblit v1.9.1