.text {
width: 642rpx;
height: 642rpx;
/* width: 590rpx;
height: 590rpx; */
/* margin-left:26rpx;
margin-top:26rpx; */
display:flex;
justify-content: center;
align-items: center;
}
.cc {
width: 642rpx;
height: 642rpx;
display:flex;
justify-content: center;
align-items: center;
}
.info{
width:200rpx;
text-align: center;
display: block;
transform-origin: center;
transform: rotate(0deg);
color: #FF6642;
/* margin-left: 195rpx; */
margin-top: -400rpx;
z-index: 10;
}
.info2{
width:200rpx;
text-align: center;
display: block;
transform-origin: center;
transform: rotate(45deg);
color: #FF6642;
z-index: 20;
margin-left: 285rpx;
margin-top: -280rpx;
}
.info3{
width:200rpx;
text-align: center;
display: block;
transform-origin: center;
transform: rotate(90deg);
color: #FF6642;
margin-left: 390rpx;
margin-top: 0rpx;
z-index: 30;
}
。。。根据实际情况依次类推
<view class="lucky_draw_zp_img" style="background:url({{zpData.zpImg}});background-size:100% 100%;{{zpRotateDeg}}">
<view class="text">
<view class="cc col-red4 f-26 pos-rel">
<view class="{{!isIOS?'info':'info11'}} pos-abs">
<view class="">
{{luck_draw_info.info.one_type == 1?'会员'+luck_draw_info.info.one_num+'天':luck_draw_info.info.one_type == 2?luck_draw_info.info.one_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.one_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info2':'info22'}} pos-abs">
<view class="">
{{luck_draw_info.info.two_type == 1?'会员'+luck_draw_info.info.two_num+'天':luck_draw_info.info.two_type == 2?luck_draw_info.info.two_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.two_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info3':'info33'}} pos-abs">
<view class="">
{{luck_draw_info.info.three_type == 1?'会员'+luck_draw_info.info.three_num+'天':luck_draw_info.info.three_type == 2?luck_draw_info.info.three_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.three_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info4':'info44'}} pos-abs">
<view class="">
{{luck_draw_info.info.four_type == 1?'会员'+luck_draw_info.info.four_num+'天':luck_draw_info.info.four_type == 2?luck_draw_info.info.four_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.four_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info5':'info55'}} pos-abs">
<view class="">
{{luck_draw_info.info.five_type == 1?'会员'+luck_draw_info.info.five_num+'天':luck_draw_info.info.five_type == 2?luck_draw_info.info.five_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.five_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info6':'info66'}} pos-abs">
<view class="">
{{luck_draw_info.info.six_type == 1?'会员'+luck_draw_info.info.six_num+'天':luck_draw_info.info.six_type == 2?luck_draw_info.info.six_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.six_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info7':'info77'}} pos-abs">
<view class="">
{{luck_draw_info.info.seven_type == 1?'会员'+luck_draw_info.info.seven_num+'天':luck_draw_info.info.seven_type == 2?luck_draw_info.info.seven_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.seven_icon}}" alt="" />
</view>
<view class="{{!isIOS?'info8':'info88'}} pos-abs">
<view class="">
{{luck_draw_info.info.eight_type == 1?'会员'+luck_draw_info.info.eight_num+'天':luck_draw_info.info.eight_type == 2?luck_draw_info.info.eight_num+'K币':'谢谢参与'}}
</view>
<image class="w-56 h-56 m-auto m-top-20" src="{{luck_draw_info.info.eight_icon}}" alt="" />
</view>
</view>
</view>
</view>
isIOS:因为安卓和ios布局有点出入,所以根据是否为ios选择不同的样式