scroll-view class 设置的高度无效,并且没有居中展示,应该如何处理

本文介绍如何通过修改WXSS文件中的page和.l-scroll样式属性,使scroll-view内的内容在微信小程序中垂直居中显示。通过调整高度和添加text-align属性,解决了内容展示不居中的问题。

<scroll-view class="lscroll" scroll-y scroll-with-animation="true">

</scroll-view>

 

.l-scroll {

width: 100%;

height: 70%;

color: #ccc;

font-size: 32rpx;

}

 

这样的话,会把所有的内容展示出来,占满所有的空间,不是我想要的,

处理:修改,wxss文件,添加page的样式 

 

page{

height:70%;

}

 

.l-scroll {

width: 100%;

height: 100%;

color: #ccc;

font-size: 32rpx;

}

 

scroll-view 垂直下拉时,内容没有居中显示,添加text-align 

添加

text-align: center;

 

 

希望有帮助

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值