transform 变换会在浏览器上单独创建一个绘画层并重新进行渲染，如果变换的属性是小数的话，边缘会出现模糊的情况
一般偏移量使用相对单位会无意中出现这种情况，比如元素高度为奇数，50%便是小数
.item {
height: 133px;
transform: translateY(-50%);
}
解决方案：
如果元素宽高可以确定
- 使用整数绝对单位（px）作为偏移量
- 将元素宽高改为偶数
如果元素宽高不确定
使用其他方案达成该效果，如让元素水平垂直居中就可以使用 flex 布局来实现
