.body{ height: 100%; overflow-y: auto; display: flex; flex-direction: column; .topbox{ width: 100%; height: 80px; min-height: 80px; border-bottom: 1px gray solid; .btnbox{ display: flex; flex-direction:row-reverse; float: right; justify-content: center; align-items: center; height: 100%; button{ width: 88px; height: 36px; } margin-right:4%; } } .title{ width: 100%; text-align: center; margin-top: 3%; span{ text-align: center; font-size: 28px; } } .buttonbox{ padding-left: 50px; button{ margin:0 10px } } .tablebox{ width: 100%; text-align: center; margin-top:2%; table{ width: 100%; text-align: center; //margin-left: 25%; margin-top:20px; th,td{ text-align: center; font-size: 15px; color: #000000; } } mat-paginator{ width: 100%; margin-left: 0%; } .mat-column-unitname{ width: 15%; } .mat-column-integrity{ width: 13%; } .mat-column-operation{ width: 5%; } .mat-column-jurisdictionsquadron{ width: 10%; } span:hover{ text-decoration:underline } } } //预览图片旋转角度 .rotateA {transform: rotate(90deg) scale(0.75);} .rotateB {transform: rotate(180deg)} .rotateC {transform: rotate(270deg) scale(0.75);} @media screen and (max-width:1200px){ .bigimgbox{ width: 880px; height: 580px; //预览图片 .previewImgBox { width: 800px; height: 475px; text-align: center; } } } @media screen and (min-width:1200px) and (max-width:1400px){ .bigimgbox{ width:880px; height: 610px; //预览图片 .previewImgBox { width: 800px; height: 500px; text-align: center; } } } @media screen and (min-width:1400px){ .bigimgbox{ width:1110px; height: 860px; //预览图片 .previewImgBox { width: 900px; height: 100%; text-align: center; } .previewImgBottom { text-align: center; height: 30px; margin: 20px auto; } } }