为了让文字在一个div中水平垂直都居中显示,用absolute定位和transform将文字放在了一个div的中间位置,
此时字号并不小,但字体边缘模糊。这是因为transform时div的宽度或者高度并不是偶数,移动50%之后,像素点并不是整数,出了小数,和显示像素没有对上。
解决方案是使用flex完成垂直居中,设置排列方向为column,并设置justify-content: center,最后用text-align: center完成水平居中。方能保证文字显示清晰。
为了让文字在一个div中水平垂直都居中显示,用absolute定位和transform将文字放在了一个div的中间位置,
此时字号并不小,但字体边缘模糊。这是因为transform时div的宽度或者高度并不是偶数,移动50%之后,像素点并不是整数,出了小数,和显示像素没有对上。
解决方案是使用flex完成垂直居中,设置排列方向为column,并设置justify-content: center,最后用text-align: center完成水平居中。方能保证文字显示清晰。