iphone8和其他iphone显示不一样,其他iphone正常,上面的是iphone8的,下面的是iphone7的
<view class=‘fate’ wx:for="{{c}}" wx:for-index=“j” wx:for-item=“f”>
<view class=‘fate-tt’ data-i=’{{i}}’ data-j=’{{j}}’ bindtap=‘showBody’>
<view>
<view class=‘tt-l’>{{f.fatename}}</view>
<view class=‘tt-r’></view>
<view class=‘clear’></view>
</view>
<image class=‘triangle {{triangle}}’></image>
</view>
<view class=‘fate-body {{f.blur}}’ style=‘display:{{f.display}};’>
<view style=‘position:relative;’>
<text>{{f.content}}</text>
<view class=‘shadow’>
<view class=‘seduce-content’>
<view class=‘seduce’>
支付即可查看2018年运势变化,助你在狗年预知财运、事业、爱情、健康等运势走向,及时调整方向,逢凶化吉,走向成功
</view>
<view class=‘pay’ data-i=’{{i}}’ data-j=’{{j}}’ bindtap=‘payFor’>马上解锁</view>
</view>
</view>
</view>
<view class=‘clear’></view>
<view class=‘rela-app’ data-i=’{{i}}’ data-j=’{{j}}’ bindtap=‘turnApp’>
<image src=’{{imageurl}}{{f.appimg}}’></image>
<view>
{{f.appname}}
</view>
<view class=‘clear’></view>
</view>
<view class=‘clear’></view>
</view>
</view>
.fate-tt {
margin: 10rpx;
box-sizing: border-box;
/* background-image: ; */
padding-bottom: 10rpx;
position: relative;
background-image: url(http://oxhrn40jj.bkt.clouddn.com/1.png);
background-size: 100% 100%;
}
.fate-tt>view {
width: 100%;
height: 100%;
box-sizing: border-box;
color: #633;
font-size: 32rpx;
line-height: 80rpx;
clear: both;
padding: 0 10rpx;
padding-left: 60rpx;
}
.fate-tt .triangle {
width: 50rpx;
height: 50rpx;
margin: 0;
padding: 0;
border: none;
position: absolute;
display: block;
top: 15rpx;
right: 10rpx;
background-image: url(http://oxhrn40jj.bkt.clouddn.com/tran2.png);
background-size: contain;
}
.fate-tt .tt-l {
float: left;
width: 85%;
font-weight: 600;
}
.fate-tt .tt-r {
float: right;
width: 14%;
}
.triangle-down {
transform: rotate(90deg);
}
.triangle-right {
}
.fate-body {
position: relative;
box-sizing: border-box;
width: 730rpx;
margin: 0 10rpx;
/* background-color: #ededd9; */
padding: 10rpx 15rpx;
margin-top: -10rpx;
display: none;
background-color: #fff;
}
.blur {
display: block;
}
.blur text {
-webkit-filter: blur(10px); /* Chrome, Opera */
-moz-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
}
.shadow {
box-sizing: border-box;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
padding: 15rpx;
}
.shadow .seduce-content {
width: 100%;
height: 100%;
box-sizing: border-box;
border: 2rpx solid #c96;
padding-top: 80rpx;
}
.shadow .seduce-content .seduce {
width: 500rpx;
margin: 0 auto;
font-size: 30rpx;
}
.shadow .seduce-content .pay {
width: 300rpx;
height: 60rpx;
border-radius: 30rpx;
box-sizing: border-box;
border: 2rpx solid #c96;
text-align: center;
line-height: 54rpx;
font-size: 30rpx;
color: #c96;
background-color: #fff;
margin: 0 auto;
margin-top: 50rpx;
}
.blur .shadow {
display: block;
}
.fate-body text {
box-sizing: border-box;
font-size: 28rpx;
line-height: 36rpx;
}
.rela-app {
background-image: url(http://oxhrn40jj.bkt.clouddn.com/3.png);
background-size: 100% 100%;
background-repeat: no-repeat;
}
.rela-app image {
width: 120rpx;
height: 80rpx;
float: left;
margin-top: 13rpx;
margin-left: 10rpx;
}
.rela-app view {
width: 560rpx;
height: 100rpx;
line-height: 100rpx;
text-align: center;
float: right;
}