微信小程序-image图片显示

众所周知的是php中想让图片正常显示出来,就需要知道图片的src-路径,知道了路径,不仅在html代码中可以正常显示,在css文件也可以正常显示,那么在小程序里边图片要怎么显示呢?

其实小程序里边想要显示图片,也是有两种途径,方法和php中大同小异,不过需要注意的是,在wxss样式文件里边是不识别本地的图片url的,但是它是认可网络路径图片。

让我们先来看一下开发者文档中关于image的介绍

微信小程序-image图片显示_第1张图片

第一种:加载本地图片,只要是路径没问题就会正常显示

  
 

第二种呢就是通过js加载传输或者利用wxss样式修改背景图片

wxml模板代码

  
  

js代码

data:{  
    imageUrl:"http://www.runoob.com/try/demo_source/paris.jpg"  
}, 

或者直接在src属性上写网络图片地址

  
  

如果在wxss样式中用到背景图片就必须用网络图片了,使用本地图片地址会报错的

.main{
  background-image: url(http://www.runoob.com/try/demo_source/paris.jpg);
}




你可能感兴趣的:(微信小程序)