css3在IOS上渐变显示错误

微信公开课小程序热门讨论关于「css3在IOS上渐变显示错误」的小程序开发问题
补充:css3在IOS上渐变显示错误
展开:当前Bug的表现渐变色在ios上显示有白条 第一张图为IOS下显示效果（IOS都是这个白条效果）第二张图是android效果 最后一行渐变色正常复现路径wxml<viewclass=cardDetails<viewclass=cardinfo<textclass=cardtitle技能描述<text<viewid=cardTextclass=cardtext{{overflowHiding?textHide:textShow}}catchtap=overflowHidingFn<text{{cardcardDescription}}<text<view<!透明遮罩层 主要显示错误位置<viewclass=hidearticleboxwx:if={{overflowHiding}}<view<!透明遮罩层 主要显示错误位置 end<view<imagesrc={{cardcardImg}}lazyload=truemode={{imgMode}}bindload=imgLoadFinishclass=cardimg<image<viewwxsscardDetails{backgroundcolor:FFBA17;display:flex;flexdirection:row;justifycontent:spacebetween;padding:66rpx42rpx;}cardinfo{fontsize:30rpx;position:relative;}cardtitle{backgroundcolor:FF8518;textalign:center;padding:8rpx20rpx;borderradius:60rpx;boxsizing:borderbox;fontsize:34rpx;display:block;width:178rpx;}cardtext{maxwidth:470rpx;lineheight:14;margintop:26rpx;}*溢出隐藏*textShow{overflow:auto;webkitlineclamp:40;}textHide{overflow:hidden;textoverflow:ellipsis;display:webkitbox;webkitlineclamp:4;webkitboxorient:vertical;}*文本透明渐变色      主要显示错误css代码  *hidearticlebox{position:absolute;zindex:300;bottom:1px;width:100%;height:40rpx;*paddingtop:20px;*backgroundimage:lineargradient(180deg,rgba(255,255,255,0)30%,FFBA17100%);backgroundimage:webkitlineargradient(90deg,rgba(255,255,255,0)30%,FFBA17100%);}提供一个最简复现Demo即速小程序：你看下在safari下或者微信浏览器下是不是也这样，css相关的问题一般是由苹果提供的浏览器内核渲染，这个我们也无能为力：麻烦给个相关的代码片段（https:developersweixinqqcomminiprogramdevdevtoolsminicodehtml）
更多有关「css3在IOS上渐变显示错误」的讨论可以前往微信公开课小程序参与互动哦！了解更多