/* pages/ControlDevice/ControlDevice.wxss */ /**index.wxss**/ .main{ width:100%; height:100%; display: flex;/*main这个框里面的元素使用flex布局方式*/ flex-direction: column; /*里面的元素这样从上到下排列*/ position:fixed; background-color: #f0ffff } .temperature_humidity{ display: flex;/*这个框里面的元素使用flex布局方式*/ flex-direction:row;/*左右排列控件,从左到右,水平线就叫做主轴,竖直的就叫做交叉轴*/ /* justify-content: flex-start | flex-end | center | space-between | space-around; */ justify-content: space-around; } /*温湿度 View*/ .temperature_view,.humidity_view{ display: flex;/*这个框里面的元素使用flex布局方式*/ flex-direction:row;/*左右排列控件,从左到右,水平线就叫做主轴,竖直的就叫做交叉轴*/ margin-top: 40rpx; } /*温湿度 图片大小*/ .temperature,.humidity{ width: 100rpx; height: 100rpx } /*温湿度 显示的文字设置*/ .temperaturetext,.humiditytext{ padding-top: 5px; font-size:30px; text-align: center; height: 150rpx; } .Switch{ width: 280rpx; height: 280rpx; margin-top: 56%; align-self: center }