/* pages/control/control.wxss */ /* logo */ page{ width: 100%; height: 100%; } .switch-1{ width: 100%; height: 7.5%; background-color: white; position: relative; border-bottom: 0.5px solid grey; } .switch-1 image{ position: absolute; } .Onlinestatus{ position: absolute; right: 5%; top: 20%; font-weight: 550; font-size: calc(100vw * 18/375); } /* 下拉选择 */ .Dropdown{ height: 100%; width: 70%; position: absolute; left: 15%; } /* 分组下拉选择 */ .group{ background-color: cornflowerblue; color: white; font-size: calc(100vw * 18/375); float: left; margin-top: 5%; height:calc(100vw * 24/375); max-width: 60%; } /* 设备下拉选择 */ .device{ background-color: cornflowerblue; color: white; font-size: calc(100vw * 18/375); margin-left: 3%; float: left; margin-top: 5%; height: calc(100vw * 24/375); max-width: 37%; } /* 主体 */ .loop-0{ width: 90%; height: 92%; margin: 0 auto; } /* 各个回路区域 */ .loop-1{ width: 100%; height: 7.3%; margin-top: 0.5%; background-color: cornflowerblue; position: relative; } .loop-1-image-1{ position: absolute; width: calc(100vw * 27/375); height: calc(100vw * 27/375); left: 5%; top: 13.5%; } .loops{ position: absolute; left: 16%; width: 53%; height: 85%; } .loops image{ width: 9%; height: 70%; } .loop-1 button{ position: absolute; display: flex; align-items:center; justify-content:center; font-size: calc(100vw * 11/375); border-radius: 20px; width: 12%; height: 75%; top: 10%; } .loop-1 button:active{ box-shadow:cornflowerblue; transform: translateY(4px); } /* 手动控制栏的按钮定位 */ .manual{ position: absolute; top: 20%; left: 5%; font-size: calc(100vw * 16/375); } .loop-install-1{ position: absolute; left: 20%; } .loop-install-2{ position: absolute; left: 40%; } .loop-install-3{ position: absolute; left: 60%; } .loop-install-4{ position: absolute; left: 80%; }