在Chrome中使用webkit-transform旋轉時的模糊文字

Question

我使用-webkit-transform: rotate()旋轉了一個元素，但問題是這在Google Chrome中無法正常工作。它看起來像Photoshop中的光滑字體。我已經添加了translate3d()但這不起作用。

你能告訴我，如果這是正常行爲還是有辦法解決這個問題？

.rotate { 
    -webkit-transform: rotate(-3.5deg) translate3d(0, 0, 0); /* Chrome, Safari 3.1+ */ 
    -moz-transform: rotate(-3.5deg); /* Firefox 3.5-15 */ 
    -ms-transform: rotate(-3.5deg); /* IE 9 */ 
    -o-transform: rotate(-3.5deg); /* Opera 10.50-12.00 */ 
    transform: rotate(-3.5deg); /* Firefox 16+, IE 10+, Opera 12.10+ */ 

    -webkit-transform-origin: 0 0;  
    -moz-transform-origin: 0 0; 
    -o-transform-origin: 0 0; 
    -ms-transform-origin: 0 0; 
    transform-origin: 0 0; 
} 

.inverse { 
    -webkit-transform: rotate(3.5deg) translate3d(0, 0, 0); /* Chrome, Safari 3.1+ */ 
    -moz-transform: rotate(3.5deg); /* Firefox 3.5-15 */ 
    -ms-transform: rotate(3.5deg); /* IE 9 */ 
    -o-transform: rotate(3.5deg); /* Opera 10.50-12.00 */ 
    transform: rotate(3.5deg); /* Firefox 16+, IE 10+, Opera 12.10+ */ 

    -webkit-transform-origin: 0 0; 
    -moz-transform-origin: 0 0; 
    -o-transform-origin: 0 0; 
    -ms-transform-origin: 0 0; 
    transform-origin: 0 0; 
} 

Answer 1

已解決！

問題不在Google Chrome，而是LayerSlider。 與z-index和絕對位置我解決了這個問題。