css3 transform之后，圖片的清晰度下降解決方式

我之前的css寫的是

.expand{
    transition: all .5s;
    transform: rotate(90deg);
   
}

發現1是原始的，2是旋轉之后，圖片的清晰度下降

 

 

經過搜索

.expand{
    transition: all .5s;
    transform: rotate(90deg) translateZ(0);
    -webkit-transform: rotate(90deg) translateZ(0);
    // -webkit-transform-origin: 50%  51%;   這一句中的百分比我看基本是這個百分比，也有的50%，53%的，可以微調，但是我加了這一句，沒起作用，然后我加了translateZ(0)這一句，立馬變清晰

 }

 

 

 

.expand{
    transition: all .5s;
    transform: rotate(90deg) translateZ(0);
    -webkit-transform: rotate(90deg) translateZ(0);
    // -webkit-transform-origin: 50%  51%;
}