美文网首页
小程序半透明黑色蒙版使用

小程序半透明黑色蒙版使用

作者: 上善若水zyz601 | 来源:发表于2017-12-26 10:52 被阅读249次

    前端页面总少不了对于半透明黑色蒙版的使用。比如说点击某个按钮就有弹框出来,弹框以外的部分,在大多数情况下都是不可点击的。这时候使用黑色半透明蒙版就显得特别重要。以下是.wxss 文件内,黑色蒙版的属性设置。

    .showImmediateDeliveryView_container{

    width:100%;

    height:100%;

    position:fixed;

    top:0;

    left:0;

    background:rgba(0,0,0,.3);

    overflow:hidden;

    z-index:101;

    }

    设置弹出框 position : absolute(绝对的)。然后在弹出框内写入自己需要的样式即可。

    .showImmediateDeliveryView{

    position:absolute;

    bottom:25%;

    top:25%;

    left:10%;

    right:10%;

    background:white;

    border-radius:10rpx;

    padding-left:25rpx;

    padding-right:25rpx;

    font-size:36rpx;

    }

    相关文章

      网友评论

          本文标题:小程序半透明黑色蒙版使用

          本文链接:https://www.haomeiwen.com/subject/yeydgxtx.html