뒤집기

[CSS] 카드 뒤집기(플립) 효과

코드 CSS를 이용하여 입체효과가 적용된 카드를 뒤집어 앞면, 뒷면 구분을 할 수 있습니다. .flip { width: 200px; height: 250px; perspective: 1100px; } .card { width: 100%; height: 100%; position: relative; transition: .4s; transform-style: preserve-3d; } .front, .back { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; } .front { background: red; } // 뒷면은 사전에 미리 뒤집기 .back { background: royalblue; transform: ..

[JS] 문자열 거꾸로 뒤집기

자바스크립트에서는 문자열 자체로 뒤집는 내장 메서드는 존재하지 않지만, 배열을 뒤집는 메서드는 존재합니다. 그리고 문자열을 배열로 바꾸는 방법도 존재합니다. 해당 방법을 응용하여 문자열을 거꾸로 뒤집을 수 있습니다. // 문자열을 배열로 const str = "12345"; 1. [...str] 2. str.split(""); 코드 const str = "123456789"; const reverseStr = [...str].reverse().join(""); console.log(str); // 123456789 console.log(reverseStr); // 987654321 문자를 배열로 나눠주고 reverse 메서드로 배열을 뒤집어 줍니다. 그 후 join 메서드로 배열을 공백 없는 하나의 문자..

[CSS] 요소 좌우반전

코드 .class { transform: scaleX(-1); } 위 코드를 좌우반전 시킬 요소에 스타일을 적용시키면 됩니다.