收藏
回答

小程序image无法同时设置投影和圆角

问题模块 框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 Bug image 工具 6.6.7 1.9.94

<image class='card-img' src='{{item.cardImage}}' mode='widthFix'></image>


.card-img {

    width:300rpx;

    margin-bottom:80rpx;

    -webkit-box-reflect:below 0 linear-gradient(transparent,transparent 65%,rgba(0,0,0,.3));

    border-radius:10px;

}

这个是image组件的class样式,添加-webkit-box-reflect:below 0 linear-gradient(transparent,transparent 65%,rgba(0,0,0,.3));会有投影,但是圆角就消失了,不知道什么原因,在h5页面这个样式写法没有问题,求大神指导一下。


最后一次编辑于  2018-06-13  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

2 个回答

  • 阳
    2018-06-14

    box-shadow和-webkit-box-reflect效果不一样,这是-webkit-box-reflect的效果:

    2018-06-14
    赞同
    回复
  • 已注销
    已注销
    2018-06-13

    border-radius: 50%;

    /* 圆形  投影 */

    box-shadow: 0rpx 0rpx 40rpx 10rpx rgba(222, 53, 88, 0.3);


    2018-06-13
    赞同
    回复