1、微信小程序scroll-view 設置可滾動視圖區域css
1.因爲手機的寬度比較窄,出現橫向滾動的須要很常見html
2.scrool-y,設置區域能夠縱向滾動web
3.scrool-into-view ,設置滾動到指定的id 處,在搜索頁面加載時能夠定位到選中項小程序
4.要出現縱向滾動條,須要給scroll-view 組件指定高度 微信小程序
2、滾動樣式指定微信
.out { background: #ddd; } /**設置高度就會出現縱向滾動條**/ .out scroll-view{ height: 200px; } .out .item { height: 100px; border: 1px solid red; background: white; margin: 10px; }
3、wxml代碼結構spa
<view>scrool-view 縱向滾動示例</view> <view class='out'> <scroll-view scroll-y scroll-into-view='item2'> <view id='item1' class='item'> <view class='inner'>1</view> </view> <view id='item2' class='item'> <view class='inner'>2</view> </view> <view class='item'> <view class='inner'>3</view> </view> <view class='item'> <view class='inner'>4</view> </view> </scroll-view> </view>
顯示結果:.net
更多:code