微信小程序通过background-image设置背景：只支持线上图片和base64图片，不支持本地图片；base64图片设置步骤如下：

1.在网站http://imgbase64.duoshitong.com/上将图片转成base64格式的文本

2.在WXSS中使用以上文本：background-image: url("data:image/png;base64,iVBORw0KGgo=...");

3.为了是背景图片自适应宽高，可以做如下设置：

background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;

小程序通过background-image设置背景图片的更多相关文章

  1. 为窗体设置背景图片-UI界面编辑器(SkinStudio)教程

    1.1.   为窗体设置背景图片 在窗体的Background属性中选择图片设置为窗体背景图片

  2. [Netbeans]为面板设置背景图片

    与AndroidStudio等类似IDE不同,在Netbeans开发桌面程序时,不可以直接通过src=@drawable 等方法为窗口设置背景图片.这里介绍一种简便的方法: 1:首先,拖动一个面板到f ...

  3. background-size 设置背景图片的大小

    background-size 设置背景图片的大小,以长度值或百分比显示,还可以通过cover和contain来对图片进行伸缩. 语法: background-size: auto | <长度值 ...

  4. QT:给Widget设置背景图片——设置Widget的调色板，调色板使用图片和背景色

    QT:给Widget设置背景图片 1 /*2 * set background image3 */4 QPixmap bgImages(":/images/bg.png");5 Q ...

  5. Qt 设置背景图片3种方法（QPalette可以做无数的事情，一旦控件指定了调色板，就要乖乖听它的话；QPainter当场绘制当然也没有问题，还有就是QSS）

    方法1. setStylSheet{"QDialog{background-image:url()"}}  //使用styleSheet 这种方法的好处是继承它的dialog都会自 ...

  6. android设置背景图片透明

    设置Activiyt为透明可以在Activity中引用系统透明主题android:theme="@android:style/Theme.Translucent" 设置背景图片透明 ...

  7. background-size （设置背景图片的大小）

    设置背景图片的大小,以长度值或百分比显示(数值包括 长度length和百分比percentage),还可以通过cover和contain来对图片进行伸缩. 语法:background-size: au ...

  8. iOS下uiview和uiscrollview设置背景图片的源码

    1.uiscrollview 设置背景图片 // Setup the Scroll ViewUIScrollView*tempScrollView=(UIScrollView*)self.view;t ...

  9. visual studio 2013设置背景图片

    今天听了公司的一个经验分享会,发现VS竟然可以设置背景图片!还是个萌妹子!!被萌了一脸鼻血!!! 设置方法很简单:安装扩展ClaudiaIDE 1.在这里下载扩展,https://visualstud ...

  10. [转]微信小程序开发之从相册获取图片 使用相机拍照 本地图片上传

    本文转自:http://blog.csdn.net/qq_31383345/article/details/53014610 今天遇到微信小程序的用户头像设置功能,做笔记. 先上gif: 再上代码: ...

随机推荐

  1. vue--音乐播放器

    github: https://github.com/vinieo/vue-music 效果: 基础组件: 1.confirm:确认对话框组件 2.listview:通讯录列表组件 3.loading ...

  2. ios外包公司——技术分享：手机应用开发步骤

    1. 确定你的创意 您的创意是否有人做过,如果有类似的app,那就要多多考虑,争取超越并且有一些独特的优化设计在其中 2. 定位应用 通过苹果的人机界面指南(Human Interface Guide ...

  3. 使用qrcode输入信息生成二维码包含二维码说明信息，点击转化为图片并下载

    说明:输入汉字和数字都可以识别并展示 <body> <h2 id="h2">二维码生成</h2> <br> <span id= ...

  4. jmeter之接口测试（http接口测试）

    基础知识储备 一.了解jmeter接口测试请求接口的原理 客户端--发送一个请求动作--服务器响应--返回客户端 客户端--发送一个请求动作--jmeter代理服务器---服务器--jmeter代理服 ...

  5. vue render里面的nativeOn

    vue render里面的nativeOn的解释官方的解释是:// 仅对于组件,用于监听原生事件,而不是组件内部使用 `vm.$emit` 触发的事件. 官方的解释比较抽象 个人理解: 父组件要在子组 ...

  6. laravel数据库迁移 和 路由防攻击

    命令:php  artisan  migrate 防攻击:

  7. Git中修复bug

    问题描述:提交的远程分支中有一个小bug需要修复: 首先在本地拉取指定分支的代码: git checkout -b test origin/远程分支 git pull 再从test分支中切一个分支: ...

  8. 发布npm

    前言 我们npm publish发布的时候,一定是本地文件发布到远程仓库,并且登录到http://registry.npmjs.org(即npm adduser或npmlogin)之后,才可以进行发布 ...

  9. CentOS 7上安装Pure-FTPd

    # 安装 yum install epel-release yum install pure-ftpd 位置文件位于/etc/pure-ftpd/pure-ftpd.conf # 修改配置文件 # 注 ...

  10. virtural machine eth1

    DEVICE=eth1HWADDR=00:50:56:33:EF:21TYPE=EthernetUUID=f35bd21c-9636-4e3f-a05c-bd4382c352bfONBOOT=yesN ...