文字垂直居中在Android机型表现不一致
类似图片文字,在模拟器中设置文字垂直居中,垂直效果能实现。在ios机型上也是有效果的,但是在安卓系统的手机上,垂直居中效果未能实现,不同安卓手机会出现偏上或者偏下效果。求指点该如何设置样式,确保能适配不同的安卓机型?
7 回复
我觉得这个其实渲染引擎的问题,ios一般是没问题的,但是android上会出现这样的问题,不管是微信小程序还是手机浏览器,我都有遇到过。我在微信小程序中的解决方法是单独针对android处理(比较麻烦一点,android上使文字垂直居中,但是它一般会向上偏移几个像素,那么就在android的机型上让它向下移几个像素):
// 获取系统信息 wepy.getSystemInfo().then(res => { this ._system_ = !!~res.system.indexOf( 'Android' ) ? 'android' : 'ios' // eslint-disable-line this .$apply() }) |
/* 单独处理 */ .vertical-text { line-height : 32 rpx; } .vertical-text.system-android { line-height : 36 rpx; } |