Add a rotation effect to the element:
-moz-transform:rotate(5deg);
-webkit-transform:rotate(5deg);
-o-transform:rotate(5deg);
-ms-transform:rotate(5deg);
transform:rotate(5deg);
The display in Firefox is normal, but in the browser under the webkit kernel, there will be obvious aliasing. If the upper element contains the overflow: hidden attribute, it will make the aliasing more obvious.
Solution:
Rendering through the GPU can effectively play the anti-aliasing effect, only need to add translateZ (0) in the CSS3 transform attribute, for example: transform: rotate (5deg) translateZ (0);
Open the webpage in safari under ipad, there will still be aliasing.
Reference: https://www.bluesdream.com/blog/css3-transform-rotate-serrated-solution.html