溫馨提示×

微信小程序如何添加一個圖片到頁面

楓吟
7585
2021-03-23 17:07:34
欄目: 云計算

微信小程序添加一個圖片到頁面的方法:1.創(chuàng)建微信小程序項目;2.在pages包中創(chuàng)建一個文件夾存放圖片素材;3.在index.wxml文件中使用圖片標簽組件調用圖片素材;4.在index.wxss文件中添加樣式設計圖片的大??;5.保存編輯的代碼并進行調試即可。

微信小程序如何添加一個圖片到頁面

具體實現(xiàn)內容:

1、首先在創(chuàng)建一個微信小程序項目。

微信小程序如何添加一個圖片到頁面

2、在項目的pages包中創(chuàng)建一個文件夾用于存放圖片素材。

微信小程序如何添加一個圖片到頁面

3、在pages包下的index目錄中index.wxml文件里使用圖片標簽組件<image>進行調用圖片素材。

<image class="login-img" src="../img/login.jpg"></image>

微信小程序如何添加一個圖片到頁面

4、可以通過pages包下的index目錄中index.wxss文件添加樣式改變圖片的大小。

page{ 

  height: 100%; 

 } 

 .login-img{ 

  width: 750rpx;

 }

微信小程序如何添加一個圖片到頁面

5、最后保存編輯的代碼進行調試,保存快捷鍵【Ctrl+S】。

在開發(fā)工具左側即可看到設計效果。

微信小程序如何添加一個圖片到頁面

0