小程序中的圖片
在小程序中，我們可以使用<image>標(biāo)簽來添加圖片。
<image>標(biāo)簽有以下屬性：
-
src：圖片路徑，可以是本地路徑或網(wǎng)絡(luò)路徑 -
mode：圖片裁剪、縮放的模式，默認(rèn)為"scaleToFill"（縮放以填充整個容器）
示例代碼
<!--1. 空圖片 -->
<image></image>
<!--2. 使用src指向圖片路徑 -->
<!-- <image src="/images/1.png" mode="aspectFit"></image> -->
<!-- <image src="/images/1.png" mode="aspectFill"></image> -->
<image src="/images/1.png" mode="widthFix"></image>
<image src="/images/1.png" mode="heightFix"></image>
效果展示
添加指向本地圖片的src屬性后的顯示效果：
CSS樣式
<image>標(biāo)簽?zāi)J(rèn)會根據(jù)圖片的寬高自適應(yīng)大小，如果沒有設(shè)置圖片的寬高屬性，則會使用圖片的原始寬高。同時，<image>標(biāo)簽也有默認(rèn)的邊框線，可以通過CSS樣式來修改。文章來源：http://www.zghlxwxcb.cn/news/detail-769723.html
image {
/* 通過邊框線證明 image 有默認(rèn)的寬和高 */
border: 1px solid red;
}
效果展示：
文章來源地址http://www.zghlxwxcb.cn/news/detail-769723.html
到了這里，關(guān)于微信小程序image標(biāo)簽的使用的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
