page { background: #f6f6f6; display: flex; flex-direction: column; justify-content: flex-start; } .list { margin-top: 40rpx; height: auto; width: 100%; background: #fff; padding: 0 40rpx; border: 1px solid rgba(0, 0, 0, 0.1); border-left: none; border-right: none; transition: all 300ms ease; display: flex; flex-direction: column; align-items: stretch; box-sizing: border-box; } .list-item { width: 100%; padding: 0; line-height: 104rpx; font-size: 34rpx; color: #007aff; border-top: 1px solid rgba(0, 0, 0, 0.1); display: flex; flex-direction: row; align-content: center; justify-content: space-between; box-sizing: border-box; } .list-item:first-child { border-top: none; } .list-item image { max-width: 100%; max-height: 20vh; margin: 20rpx 0; } .request-text { color: #222; padding: 20rpx 0; font-size: 24rpx; line-height: 36rpx; word-break: break-all; } .guide { width: 100%; padding: 40rpx; box-sizing: border-box; display: flex; flex-direction: column; } .guide .headline { font-size: 34rpx; font-weight: bold; color: #555; line-height: 40rpx; } .guide .p { margin-top: 20rpx; font-size: 28rpx; line-height: 36rpx; color: #666; } .guide .code { margin-top: 20rpx; font-size: 28rpx; line-height: 36rpx; color: #666; background: white; white-space: pre; } .guide .code-dark { margin-top: 20rpx; background: rgba(0, 0, 0, 0.8); padding: 20rpx; font-size: 28rpx; line-height: 36rpx; border-radius: 6rpx; color: #fff; white-space: pre } .guide image { max-width: 100%; } .guide .image1 { margin-top: 20rpx; max-width: 100%; width: 356px; height: 47px; } .guide .image2 { margin-top: 20rpx; width: 264px; height: 100px; } .guide .flat-image { height: 100px; } .guide .code-image { max-width: 100%; } .guide .copyBtn { width: 180rpx; font-size: 20rpx; margin-top: 16rpx; margin-left: 0; } .guide .nav { margin-top: 50rpx; display: flex; flex-direction: row; align-content: space-between; } .guide .nav .prev { margin-left: unset; } .guide .nav .next { margin-right: unset; }