在WebApp中,使用line-height
等于height
,设置文字垂直居中时,安卓渲染会出现偏上、并不居中的问题;
在ios和chrome触屏调试模式下是正确的显示模式;
解决方法是:
1、改变字体大小
.buy-btn {
/*
width
line-height
height
font-size
border-radius
都定义成2倍 再缩小为一半 最后向右平移100%
适配安卓渲染 垂直居中偏上的问题
*/
width: 156px;
text-align: center;
background-color: @color-red;
color: @color-white;
border-radius: 30px;
height: 48px;
line-height: 48px;
font-size: 26px;
transform: scale(0.5);
transform-origin: 100% 0%;
}
但是这样会略微使文字偏下。
网友评论