page{ width: 100%; height: 100vh; overflow: hidden; } .container { width: 100%; height: 100vh; padding: 20rpx 0; overflow: hidden; display: flex; align-content: center; flex-direction: row; justify-content: center; font-size: 28rpx; box-sizing: border-box; } .handleBtn { display: inline-flex; flex-direction: column; justify-content: space-between; align-content: space-between; flex: 1; padding-right: 20rpx; box-sizing: border-box; overflow: hidden; } .handleBtn button { text-align: center; transform: rotate(90deg); } .handleBtn button:not([size='mini']) { width: 160rpx; margin-top: 40rpx; margin-bottom: 40rpx; } .handCenter { border: 4rpx dashed #e9e9e9; flex: 5; overflow: hidden; box-sizing: border-box; } .handRight { display: inline-flex; align-items: center; } .handRight .handTitle { transform: rotate(90deg); flex: 1; color: #666; } .handWriting { background: #fff; width: 100%; height: 95vh; flex: 2; }