如图:
代码:
1 .userInfoView{ 2 width: 100%; 3 height: 592rpx; 4 margin-top: 40rpx; 5 padding-bottom: 20rpx; 6 } 7 .userInfoLi{ 8 width: 100%; 9 height: 176rpx; 10 background-color: #F8F9FC; 11 margin-bottom: 20rpx; 12 border-radius: 8rpx; 13 } 14 .userinfonName{ 15 position: absolute; 16 left: 108rpx; 17 top: 24rpx; 18 font-size: 28rpx; 19 color: #333333; 20 } 21 .userinfoType{ 22 margin-left: 20rpx; 23 color: #999999; 24 font-size: 24rpx; 25 } 26 .userinfoCord{ 27 position: absolute; 28 left: 108rpx; 29 top: 74rpx; 30 font-size: 24rpx; 31 color: #999999; 32 } 33 .userinfoncordNer{ 34 position: absolute; 35 left: 212rpx; 36 top: 74rpx; 37 font-size: 24rpx; 38 color: #999999; 39 } 40 .userinfoPhone{ 41 position: absolute; 42 left: 108rpx; 43 top: 118rpx; 44 font-size: 24rpx; 45 color: #999999; 46 } 47 .userinfoPhoneNer{ 48 position: absolute; 49 left: 212rpx; 50 top: 118rpx; 51 font-size: 24rpx; 52 color: #999999; 53 } 54 .userinfonAdit{ 55 position: absolute; 56 left: 602rpx; 57 top: 74rpx; 58 width: 28rpx; 59 height: 27rpx; 60 } 61 .touch-item { 62 height: 176rpx; 63 background-color: #F8F9FC; 64 margin-bottom: 20rpx; 65 border-radius: 8rpx; 66 font-size: 14px; 67 display: flex; 68 justify-content: space-between; 69 width: 100%; 70 overflow: hidden 71 } 72 73 .content { 74 width: 100%; 75 margin-right:0; 76 -webkit-transition: all 0.4s; 77 transition: all 0.4s; 78 -webkit-transform: translateX(90px); 79 transform: translateX(90px); 80 margin-left: -90px; 81 position: relative; 82 } 83 .userCheckIcon{ 84 position: absolute; 85 left: 40rpx; 86 top: 74rpx; 87 width: 28rpx; 88 height: 28rpx; 89 } 90 .del { 91 background-color: #F56141; 92 width: 90rpx; 93 display: flex; 94 flex-direction: column; 95 align-items: center; 96 justify-content: center; 97 color: #fff; 98 -webkit-transform: translateX(90px); 99 transform: translateX(90px); 100 -webkit-transition: all 0.4s; 101 transition: all 0.4s; 102 font-size: 28rpx; 103 } 104 105 .touch-move-active .content, 106 .touch-move-active .del { 107 -webkit-transform: translateX(0); 108 transform: translateX(0); 109 }