微信小程序通过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. JS开发工具WebStorm使用快捷键

    快捷键可以提高开发效率,最好用的就是这些! 代码编辑 Ctrl + d   复制整行 Ctrl + '-/+'  模块折叠 Ctrl + [ ]   括号匹配 Ctrl + F12 结构展示 Shif ...

  2. html5的websocket

    转载:http://blog.csdn.net/liuhe688/article/details/50496780 var WebSocketServer = require('ws').Server ...

  3. Go语言开发Prometheus Exporter示例

    一.Prometheus中的基本概念 Prometheus将所有数据存储为时间序列,这里先来了解一下prometheus中的一些基本概念 指标名和标签每个时间序列都由指标名和一组键值对(也称为标签)唯 ...

  4. 微信小程序 密码键盘 - 密码页面组件 (原生小程序代码)

    1.WXML页面 <view> <!--<section class="mask" catchtap="canclePwd" wx:if ...

  5. 获取ip地址&&测试ip地址

    # request# 动态页面加载 Selenium# request# 响应类型为 json# import json # json.loads(str) # 将str转化为dict# json.d ...

  6. CF 3-6 2级组 D题 STRESSFUL TRAINING 紧张的比赛

    题目大概是这样的: 给出一个数列a[n] ,对于每一个数 a [i] 来说 都会在 T - - 时 -= b[i] 每个数都在任何时刻不能小于0 你可以在每次T - - 之前时给 一 个 a[i] + ...

  7. html5（七） Web存储

    http://www.cnblogs.com/stoneniqiu/p/4206796.html http://www.cnblogs.com/v10258/p/3700486.html html5中 ...

  8. pycharm import scrapy 报错，No module named 'scrapy'

    本地通过下载 pip install scrapy安装成功后,在pychram里面 import scrapy报错 后来在找了各种解决方法,重装wheel,twisted,都不行,最后发现是需要改Pr ...

  9. vue项目中多个组件之间传递数据

    //父组件<template> <div> <div style="float: left"> <input-data :city=&qu ...

  10. sql 中取整，四舍五入取整，向下取整，向上取整。

    SELECT round(52.45, 0) AS round4, round(52.54, 0) AS round5, round(52.45, 1) AS round41, round(52.54 ...