亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

微信小程序淘寶首頁(yè)雙排圖片布局排版代碼(推薦)

 更新時(shí)間：2020年10月29日 11:58:59   作者：待我成長(zhǎng)L  
這篇文章主要介紹了微信小程序淘寶首頁(yè)雙排圖片布局排版代碼,本文通過(guò)圖文實(shí)例相結(jié)合給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下

效果圖：

在這里插入圖片描述

使用技術(shù)主要是flex布局,絕對(duì)定位布局,小程序前端頁(yè)面開(kāi)發(fā),以及一些樣式!

直接貼代碼,都有詳細(xì)注釋,熟悉一下,方便以后小程序開(kāi)發(fā)!

wxml:

 <view class="taobaolist">
 <block wx:for="{{imagelist}}" wx:key="item">
  <view class="taobao-list">
    <view class="taobao-list-info" index="{{index}}">
     <image class="taobao-list-photo" src="{{item.imageUrl}}"/>
     <text class="taobao-list-desc">{{item.content}}</text>
    </view>
  </view>
 </block>
</view>

js:

imagelist:[{
   imageUrl:'/image/img1.webp',
   content:'包郵 韓式創(chuàng)意玻璃水杯架 瀝水杯架茶杯架 倒掛架酒杯架瀝水盤(pán)',
  },{
   imageUrl:'/image/img2.webp',
   content:'景德鎮(zhèn)陶瓷 手繪小花瓶 擺件迷你裝飾藝術(shù)花插新中式家居茶幾插花',
  },{
   imageUrl:'/image/img3.webp',
   content:'可煮藥18-24CM琺瑯搪瓷湯鍋雙耳加厚燉鍋平底鍋盆電磁爐煤氣通用',
  },{
   imageUrl:'/image/img4.webp',
   content:'雛菊氣球簾提拉簾刺繡成品窗紗羅馬窗簾臥室飄窗簾 琪琪布藝', 
  }]

wxss:

.taobaolist{
 margin-top: 20rpx;
}
.taobao-list-info{
 float: left;
 margin-left: 20rpx;
 margin-top: 20rpx;
 position: relative;
}

.taobao-list-photo{
 width: 350rpx;
 height: 350rpx;
}
.taobao-list-desc{
 display: block;
 position: absolute;
 color: #000000;
 left: 0;
 width: 100%;
 text-align: center;
 font-size: 25rpx;
 padding: 10rpx;
 
}

到此這篇關(guān)于微信小程序淘寶首頁(yè)雙排圖片布局排版代碼的文章就介紹到這了,更多相關(guān)小程序雙排圖片布局排版內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

最新評(píng)論