fastNetwork/pages/setting/setting.wxss

.main {
  float: left;
  width: 100%;
  height: 100%;
  /* background-image: linear-gradient(#ff0000, #ffffff); */
  background-color: #f9fafc;
}

.main .one {
  position: fixed;
  z-index: 9999;
  width: 95%;
  height: 80rpx;
  line-height: 80rpx;
  background-color: #409eff;
  padding: 0 20rpx;
}

.main .one .left {
  float: left;
  width: 30%;
  color: #ffffff;
}

.main .one .right {
  float: right;
  width: 70%;
}

.main .one .right {
  text-align: right;
  color: #fff;
}

.main .one .right .van-icon {
  top: 6rpx;
  color: #666;
}

.main .one .right button {
  font-size: 20rpx;
  padding: 5rpx 30rpx;
  float: left;
  margin: 10rpx 0;
}

.main .two {
  position: relative;
  top: 80rpx;
  width: 100%;
  height: 93vh;
  overflow: hidden;
}

.main .two .image {
  float: left;
  width: 100%;
  height: 100%;
}

.main .two .userInfo {
  float: left;
  width: 100%;
  height: 100%;
  position: absolute;
}

/* 模板一 */
.temOne {
  float: left;
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 5px;
  color: #ffffff;
}

.temOne .avatarUrl {
  width: 100rpx;
  height: 100rpx;
  border-radius: 90rpx;
}

.temOne view {
  padding: 5rpx 0;
}

.temOne .qrcode {
  width: 200rpx;
  height: 200rpx;
}

/* 模板二 */
.temTwo {
  float: left;
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 5px;
  color: #ffffff;
}

.temTwo .avatarUrl {
  width: 100rpx;
  height: 100rpx;
  border-radius: 90rpx;
}

.temTwo view {
  padding: 5rpx 0;
}

.temTwo .qrcode {
  width: 200rpx;
  height: 200rpx;
}

/* 模板三 */
.temThr {
  float: left;
  width: 100%;
}

.temThr .temThrOne {
  float: right;
  width: 60%;
  padding: 20rpx 0 0 0;
}

.temThr .temThrOne .avatarUrl {
  float: left;
  width: 100rpx;
  height: 100rpx;
  border-radius: 90rpx;
}

.temThr .temThrOne view {
  float: left;
  width: 68%;
  padding: 0 20rpx;
}

.temThr .temThrOne view text {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 30rpx;
  padding: 10rpx 0 0 0;
  font-weight: bold;
}

.temThr .temThrTwo {
  float: left;
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 5px;
}

.temThr .temThrTwo .qrcode {
  width: 200rpx;
  height: 200rpx;
}

/* 模板四 */
.temFour {
  float: left;
  width: 100%;
}

.temFour .temThrOne {
  float: right;
  width: 60%;
  padding: 20rpx 0 0 0;
}

.temFour .temThrOne .avatarUrl {
  float: left;
  width: 100rpx;
  height: 100rpx;
  border-radius: 90rpx;
}

.temFour .temThrOne view {
  float: left;
  width: 68%;
  padding: 0 20rpx;
}

.temFour .temThrOne view text {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 30rpx;
  padding: 10rpx 0 0 0;
  font-weight: bold;
}

.temFour .temThrTwo {
  float: left;
  width: 100%;
  text-align: right;
  position: absolute;
  bottom: 5px;
  right: 40rpx;
}

.temFour .temThrTwo .qrcode {
  width: 200rpx;
  height: 200rpx;
}

.temFive view:nth-child(1) {
  position: absolute;
  width: 11%;
  top: 25%;
  text-align: center;
}

.temFive view:nth-child(1) text {
  writing-mode: tb-rl;
  color: #ffffff;
  font-weight: bold;
  letter-spacing: 10rpx;
  font-weight: bold;
}

.temFive view:nth-child(2) {
  position: absolute;
  width: 68%;
  top: 32%;
  left: 16%;
  text-align: center;
}

.temFive view:nth-child(2) image {
  margin: 0 10rpx;
}

.temFive view:nth-child(2) .avatarUrl {
  width: 200rpx;
  height: 200rpx;
  border-radius: 90rpx;
}

.temFive view:nth-child(2) .qrcode {
  width: 200rpx;
  height: 200rpx;
}

.temFive view:nth-child(3) {
  position: absolute;
  right: 0;
  top: 25%;
  width: 11%;
  text-align: center;

}

/* .temFive {
  float: left;
  width: 100%;
}

.temFive view {
  float: left;
}

.temFive view:nth-child(1) {
  width: 11%;
  text-align: center;
  padding: 300rpx 0 0 0;
}

.temFive view:nth-child(1) text {
  writing-mode: tb-rl;
  color: #ffffff;
  font-weight: bold;
  letter-spacing: 10rpx;
  margin: 60rpx 0 0 0;
  font-weight: bold;
}

.temFive view:nth-child(2) {
  width: 78%;
  text-align: center;
  height: 250rpx;
  position: absolute;
  top: 31%;
}

.temFive view:nth-child(2) .avatarUrl {
  width: 100rpx;
  height: 100rpx;
  border-radius: 90rpx;
}

.temFive view:nth-child(2) .qrcode {
  width: 200rpx;
  height: 200rpx;
}

.temFive view:nth-child(3) {
  width: 11%;
  text-align: center;
  padding: 45% 0 0 0;
} */

.temFive view:nth-child(3) text {
  writing-mode: tb-rl;
  text-orientation: upright;
  color: #fff;
  font-weight: bold;
  letter-spacing: 10rpx;
}