求大神解释为什么

代码如下

.demo1{

height: 28rpx;

line-height: 28rpx;

width: 60rpx;

font-size: 20rpx;

text-align: center;

border: 1rpx solid #f00;

margin: 10rpx;

}

.demo2{

height: 56rpx;

line-height: 56rpx;

width: 120rpx;

font-size: 40rpx;

text-align: center;

border: 2rpx solid #f00;

margin: 20rpx;

transform-origin: 0 0;

transform: scale(0.5)

}

<view class=‘demo1’>你好</view>

<view class=‘demo2’>你好</view>

以上android直机上表现差据较大，主要是border 1像素不一致，和使用line-height垂直居中问题