//home.wxml
<scroll-view scroll-x="true" class="boxs">
<view class="box">
<view>
<image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image>
<view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉·库尔蒙科尔佩特 Narilya Gulmongkolpech</view>
</view>
</view>
<view class="box">
<view>
<image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image>
<view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉</view>
</view>
</view>
<view class="box">
<view>
<image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image>
<view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉·库尔蒙科尔佩特</view>
</view>
</view>
<view class="box">
<view>
<image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image>
<view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉·库尔蒙科尔佩特 Narilya Gulmongkolpech</view>
</view>
</view>
</scroll-view>
//home.wxss
.boxs{
width: 100%;
white-space: nowrap;
}
.boxs .box{
overflow: hidden !important;
display: inline-block;
}
//微信开发工具模拟器效果
//iphoneX上的效果
解决方案: 1、在scroll-view中添加一个view包裹列表内容 这样就不需要overflow:hidden了 注意:虽然我也没办法用官方原理解决,但是以后使用scroll-view组件时最好在里面加一个view包裹 //home.wxml <scroll-view scroll-x="true" class="boxs"> <view class="boxss"> <view class="box"> <view> <image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image> <view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉·库尔蒙科尔佩特 Narilya Gulmongkolpech</view> </view> </view> <view class="box"> <view> <image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image> <view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉</view> </view> </view> <view class="box"> <view> <image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image> <view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉·库尔蒙科尔佩特</view> </view> </view> <view class="box"> <view> <image style="width: 200rpx;" src="../../images/p2669942342.jpg"></image> <view style="white-space: normal;width: 200rpx; height: 200rpx;">纳瑞拉·库尔蒙科尔佩特 Narilya Gulmongkolpech</view> </view> </view> </view> </scroll-view> //home.wxss .boxs{ width: 100%; white-space: nowrap; } .boxs .boxss{ display: flex; } .boxs .box{ display: inline-block; }
你并没有给.box加宽和高,如何hidden?