Maison  >  Article  >  Applet WeChat  >  Comment définir une image d'arrière-plan lors du développement d'un petit programme

Comment définir une image d'arrière-plan lors du développement d'un petit programme

王林
王林avant
2020-12-29 09:29:534004parcourir

Comment définir une image d'arrière-plan lors du développement d'un petit programme

Introduction :

Nous savons que lors du développement de l'applet WeChat, nous ne pouvons pas référencer directement les images locales dans le fichier wxss, sinon l'erreur suivante se produira lors de l'exécution :

(Partage de vidéos d'apprentissage : Vidéo de programmation)

"Les images de ressources locales ne peuvent pas être obtenues via WXSS. Vous pouvez utiliser des images réseau, ou base64, ou utiliser da07518104315e1a3bb352b3dbb6dedb

Étapes spécifiques :

1. Ajoutez une balise 565b296a3970f2fc50e58c1bb915cb79 dans le fichier wxml :

<!--页面根标签-->
<view class="content">
	<!--pics文件夹下的background.jpg文件-->
	<image class=&#39;background&#39; src="../../pics/background.jpg" mode="aspectFill"></image>
	<!--页面其它部分-->
</view>

2. Ajoutez :

page{
  height:100%;
}
.background {
  width: 100%;
  height: 100%;
  position:fixed; 
  background-size:100% 100%;
  z-index: -1;
}
dans le fichier wxss.

Il est à noter que z-index: -1 peut mettre l'image en bas sans affecter les autres parties.

(Recommandations associées : Tutoriel de développement de mini-programmes)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer