.header{ width: 100%; height: 99px; background-image: url(../img/5G%20通信流量监控.png); background-position: center; background-repeat: no-repeat; } .header img{ float: left; margin: 15px 30px; } .model_1,.model_2{ width: 98%; display: table; padding: 20px 1% 0px; } .model_3{ width: 97%; height: 400px; margin: 20px 1%; background-image: url(../img/5g通讯流量监控-下半部分框.png); background-size: 100% 100%; } .model1-1{ width: 357px; height: 104px; padding: 20px; background-image: url(../img/顶部框-长.png); background-size: 100% 100%; float: left; } .model1-1 p,.model1-2 p{ font-size: 14px; color: #fff; } .model1-1 ul,.model1-2 ul{ width: 100%; display: table; padding-top: 8px; } .model1-1 ul li{ width: 33.3%; display: table; float: left; } .model1-1 ul li p,.model1-2 ul li p{ font-size: 34px; color: aqua; text-align: center; font-weight: bold; } .model1-1 ul li p:nth-child(2),.model1-2 ul li p:nth-child(2){ font-size: 16px; color: #fff; margin-top: 10px; font-weight: normal; } .model1-2{ width: 305px; height: 104px; padding: 20px; background-image: url(../img/顶部框-短.png); float: left; margin-left: 8px; background-size: 100% 100%; } .model1-2 ul li{ width: 47%; display: table; float: left; } .model1-2 ul li:nth-child(2){ width: 1%; } .model1-2 ul li:nth-child(2) p{ color: #FFF; font-size: 12px; line-height: 45px; } .model1-1 ul li p span{ font-size: 12px; font-weight: normal; margin: 0px 10px; color: #fff; } .model_2 div{ width: 925px; height: 244px; float: left; background-size: 100% 100%; } .model2_1{ background-image: url(../img/5g通讯流量监控-上下行趋势框.png); } .model_2 div:nth-child(1){ margin-right: 10px; } .model_2 div ul{ color: #00FFFF; line-height: 50px; margin-left: 40px; } .model3_2_1 ul{ color: #00FFFF; line-height: 50px; margin-left: 20px; } .model3_1,.model3_2{ width: 880px; height: 360px; float: left; padding: 20px; } .model3_2{ padding: 0px; float: right; width: 920px; height: 400px; } .model3_2_1{ width: 100%; height: 200px; }