뒤집기/반전/미러링 사용하여 텍스트 CSS는

나는 약간의 인터넷 검색을했다

여기에 어쩌면 우리는 약간의 필요, 내 대답뒤집기/반전/미러링 사용하여 텍스트 CSS는

<!--[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>

여기

유일한 문제 미러링의 중심이 물체의 중심되지 않는 것입니다입니다 자바 스크립트는 우리가 원하는 곳에 객체를 이동시킵니다.

출처

2010-08-08 TiansHUo

'transform-origin'을 사용하여 변환이 적용되는 지점을 제어하십시오. –

+12

˙pɐdǝʇou sʍopuᴉʍ ʇsnɾ ƃuᴉsn ʇᴉ ʎɐldsᴉp puɐ ǝlᴉɟ ʇxǝʇ ɐ sɐ ʇᴉ ǝʌɐs uɐɔ noʎ ʇɐɥʇ ǝƃɐʇuɐʌpɐ ǝɥʇ sɐɥ oslɐ ʇxǝʇ uᴉɐlԀ ˙sᴉɥʇ ǝʞᴉl sɐǝɹɐ xoq-ʇuǝɯɯoɔ ƃuᴉpnlɔuᴉ 'pǝʍollɐ sᴉ ʇxǝʇ uᴉɐld ǝɹǝɥʍ ǝɹǝɥʍʎuɐ ʇᴉ ǝʇsɐd puɐ ʎdoɔ uɐɔ noʎ ʇɐɥʇ sᴉ ɥɔɐoɹddɐ sᴉɥʇ ɟo ǝƃɐʇuɐʌpɐ ǝɥ┴ ˙ʇɔǝɟɟǝ ɹoɹɹᴉɯ * ʇɔǝɟɹǝd * ɥʇᴉʍ sɹǝʇɔɐɹɐɥɔ ʎɐldsᴉp uɐɔ noʎ 'ɥƃnoɥʇ ** ʇdᴉɹɔsɐʌɐs ǝlʇʇᴉl ɐ ** ʇsnɾ ɥʇᴉM 나는 위의 코멘트를 읽어 거꾸로 내 노트북을 뒤집어 저항 – Pacerier

. 이 ... 시간이 좀 걸렸어. – Kay

코드는 올바르지 만이 작업을 수행하는 쉬운 방법이있다 :

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 */ 
}

나는 이것이 당신의 중심 미러링 문제를 해결할 생각합니다.

출처

2010-08-08 14:27:54 hitautodestruct

+12

블록 또는 인라인 블록 요소를 사용해야한다는 점에 유의하십시오. http://codepen.io/igalst/pen/fKhmp – IgalSt

뒤집기/반전/미러링 사용하여 텍스트 CSS는

답변

관련 문제