android上line-height的问题
2016-06-29 17:21
351 查看
关于line-height大家应该非常熟悉了吧,就是用来做垂直居中的,屡试不爽,基本上没有什么问题,但是最近一个项目,测试提了一个bug,看图吧。
从别处窃的图,这个问题只有安卓上才能复现,做了demo,发现应该是font-size的问题,你们可以自己试试,font-size为13px或者奇数时,line-height会有一定的偏差,在safari上没有问题,至于原因,现在还没找到,等找到了再来补充吧。
解决办法
虽然原因没有找到,但是可以大致猜出是安卓上奇数字号导致line-height均分上下边距的时候出现了偏差,那么,我们就可以通过这方面入手。
既然line-height均分不了,那就抛弃line-height吧,看代码
element{
font-size: 13px;
line-height:0;
padding: 15px 0;//相当于line-height 30px
}
很简单吧,将line-height设为0,用padding来进行填充,完美实现,自测没什么问题,如果造成其他问题,欢迎留言指出
从别处窃的图,这个问题只有安卓上才能复现,做了demo,发现应该是font-size的问题,你们可以自己试试,font-size为13px或者奇数时,line-height会有一定的偏差,在safari上没有问题,至于原因,现在还没找到,等找到了再来补充吧。
解决办法
虽然原因没有找到,但是可以大致猜出是安卓上奇数字号导致line-height均分上下边距的时候出现了偏差,那么,我们就可以通过这方面入手。
既然line-height均分不了,那就抛弃line-height吧,看代码
element{
font-size: 13px;
line-height:0;
padding: 15px 0;//相当于line-height 30px
}
很简单吧,将line-height设为0,用padding来进行填充,完美实现,自测没什么问题,如果造成其他问题,欢迎留言指出
相关文章推荐
- Android 自定义View中drawText获取text宽度的三种方式
- android应用内部实现生成桌面快捷方式与进度条控制音量大小
- Android中的“再按一次返回键退出程序”实现
- android源码解析之(一)-->android项目构建过程
- android--之笔记(一)
- Android项目研发之多分辨率适配
- 深入理解Android消息处理系统——Looper、Handler、Thread
- Android生命周期
- android控制系统回退按钮再按一次退出程序
- Android中的FlexboxLayout
- Activity的启动模式
- 通过js调用android原生方法
- Android开发环境搭建
- Android RecyclerView设置item间距
- Android取消EditText自动默认获取焦点行为
- Android 热补丁动态修复框架小结
- 安卓报错
- Android软键盘弹出,返回键Activity不结束
- Android跨进程通信之ContentProvider
- Android开发中RecyclerView组件使用的一些进阶技讲解