美文网首页
微信小程序设置背景图片

微信小程序设置背景图片

作者: 波叫怪 | 来源:发表于2019-05-03 20:24 被阅读0次

    经常为微信小程序设置颜色背景,突然发现一张好看的图片怎么把它设置为背景呢?
    以下总结了三种方法:

    css中通过url获取网络图片

    微信小程序中不能使用本地图片

      background-image:url(https://xxxxxxxxxxxxxxxxxxxxxx)
    

    Base64编码格式

    background-image:url(转换之后的base64字符串)
    

    利用流布局,设置z-index层级,将image标签置于底层

    //html
    <view class="container">
      <image src='../image/1.jpg'></image>
      <view class='up'>
        我是一串字符串
      </view>
    </view>
    

    //css
    .container{
      width: 100%;
      height: 600rpx;
      margin: 0;
      padding: 0;
      position: relative;
    }
    image{
      position: absolute;
      width: 100%;
      height: 600rpx;
    }
    .up{
      position: absolute;
      z-index: 1;
    }

    相关文章

      网友评论

          本文标题:微信小程序设置背景图片

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