Flipping/inverting/Mirroring văn bản sử dụng css chỉ

Question

tôi đã làm một số googling và đây là câu trả lời của tôi

<!--[if IE]> 
<style> 
    .mirror { 
     filter: progid:DXImageTransform.Microsoft.BasicImage(mirror=1); 
    } 
</style> 
<![endif]--> 
<style> 
.mirror { 
    display:block; 
    -moz-transform: matrix(-1, 0, 0, 1, 0, 0); 
    -webkit-transform: matrix(-1, 0, 0, 1, 0, 0); 
    -o-transform:matrix(-1, 0, 0, 1, 0, 0); 
} 
</style> 
<div class="mirror">testing</div> 

Vấn đề duy nhất ở đây là trung tâm của mirroring không phải là trung tâm của đối tượng, vì vậy có lẽ chúng ta cần một số javascript để di chuyển đối tượng mà chúng tôi muốn.

Answer 1

Mã của bạn là đúng nhưng có một cách dễ dàng hơn để làm điều này:

img.flip { 
    -moz-transform: scaleX(-1); /* Gecko */ 
    -o-transform: scaleX(-1);  /* Opera */ 
    -webkit-transform: scaleX(-1); /* Webkit */ 
    transform: scaleX(-1);   /* Standard */ 
    filter: FlipH;     /* IE 6/7/8 */ 
} 

Tôi nghĩ rằng điều này giải quyết vấn đề phản ánh trung của bạn.