page{ height: 100%; width: 100%; background: #f4f4f4; } .container{ background: #f4f4f4; height: auto; overflow: hidden; width: 100%; } .userinfo { display: flex; justify-content: space-between; align-items: center; padding: 20rpx 60rpx 20rpx 40rpx; background: #1fe4dc; width: 100%; } .u-avatar{ position: relative; display: flex; align-items: center; } .userinfo-avatar { width: 100rpx; height: 100rpx; margin: 0; border-radius: 50%; } .userinfo-nickname { color: #010101; margin-left: 20rpx; } .userinfo-setting image{ width: 60rpx; height: 60rpx; } .btn-cls{ opacity: 0; position: absolute; width: 100rpx; height: 100rpx; margin: 0; border-radius: 50%; padding: 0; top: 0; left: 0; z-index: 999; } .profile-info{ width: 100%; height: 280rpx; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; padding: 0 30.25rpx; background: #333; } .profile-info .avatar{ height: 148rpx; width: 148rpx; border-radius: 50%; } .profile-info .info{ flex: 1; height: 85rpx; padding-left: 31.25rpx; } .profile-info .name{ display: block; height: 45rpx; line-height: 45rpx; color: #fff; font-size: 37.5rpx; margin-bottom: 10rpx; } .profile-info .level{ display: block; height: 30rpx; line-height: 30rpx; margin-bottom: 10rpx; color: #7f7f7f; font-size: 30rpx; } .service { position: static; background-color: transparent; color: transparent; margin: 0; padding: 0; border: none; text-align: left; line-height: normal; display: inline; } .company { font-size:20rpx; text-align:center; margin-top:50px; } .kefutest{ width: 100rpx; background: red; height: 50rpx; position: absolute; bottom: 0; } .kefutest2{ width: 100rpx; background: red; height: 50rpx; position: absolute; bottom: 80rpx; } .order-list{ background: #fff; padding: 40rpx 20rpx; display: flex; justify-content: space-around; margin-bottom: 20rpx; font-size: 24rpx; } .i-line{ width: 2rpx; height: 100rpx; background: #f4f4f4; } .order-list .or-a{ flex: 5 } .order-list .navigator,.order-list button{ text-align: center; background: none; opacity: 1; font-size: 0; padding: 0; flex: 4; } .order-list view{ font-size: 24rpx; line-height: 1; } .order-list image{ width: 54rpx; height: 54rpx; margin-bottom: 18rpx; } .related-goods{ width: 750rpx; height: auto; overflow: hidden; } .related-goods .h{ position: relative; height: 145.5rpx; width: 750rpx; padding: 56.25rpx 0; background: #fff; text-align: center; border-bottom: 1px solid #f4f4f4; } .related-goods .h .line{ display: inline-block; position: absolute; top: 72rpx; left: 0; z-index: 2; height: 1px; margin-left: 225rpx; width: 300rpx; background: #ccc; } .related-goods .h .title{ display: inline-block; position: absolute; top: 56.125rpx; left: 0; z-index: 3; height: 33rpx; margin-left: 285rpx; width: 180rpx; background: #fff; } .related-goods .b{ width: 750rpx; height: auto; overflow: hidden; } .related-goods .b .item{ float: left; background: #fff; width: 375rpx; height: auto; overflow: hidden; text-align: center; padding: 15rpx 31.25rpx; border-right: 1px solid #f4f4f4; border-bottom: 1px solid #f4f4f4; min-height: 530rpx; position: relative; } .related-goods .item .img{ width: 312rpx; height: 312rpx; } .related-goods .item .name{ display: block; width: 312rpx; margin: 11.5rpx 0 15rpx 0; text-align: center; font-size: 30rpx; color: #333; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .related-goods .item .price{ display: block; width: 312rpx; height: 40rpx; text-align: center; font-size: 30rpx; color: #1fe4dc; position: absolute; bottom: 10rpx; }