Question

当我想旋转div时，我也想旋转文本，但我仍然遇到抗锯齿问题。文字很模糊，我无法修复它。这种效果发生在Firefox和Chrome中。

我找到了这个解决方案，但它对我不起作用。

-webkit-backface-visibility: hidden;

HTML

<div id="rotate">
    <span>Hi, iam rotated blurry text </span> 

</div>

css

#rotate{
margin-top:30px;
    -moz-transform: rotate(-9deg);
    -ms-transform: rotate(-9deg);
    -o-transform: rotate(-9deg);
    -webkit-transform: rotate(-9deg);
    transform: rotate(-9deg);
background:#292929;
font-size:30px;
color:green;
display:inline-block;
}

link：http://jsfiddle.net/P52Yu/6/

plz help :)。

Answer 1

当涉及转换时，Chrome很难处理带有大量小数位的数字。尝试对这些数字执行parseInt以使小数位下降。通过这个简单的修复，您会发现模糊性经常消失。

Chrome和Firefox中的模糊文字

1 个答案: