CSS 변환으로 기울이기 달성: 양쪽 기울이기
제공된 이미지는 요소의 양쪽 모서리를 기울이는 흥미로운 기울이기 효과를 보여줍니다. CSS 변환을 사용하여 이 효과를 다시 만들려면 다음 단계를 따르세요.
원근감 기울이기 적용:
원근감을 추가하려면 다음 CSS 속성을 사용하세요.
transform: perspective(distance) rotateY(angle);
"거리"를 원근 거리를 설정하는 값으로 바꿉니다(값이 높을수록 더 먼 원근이 생성됨). "angle"을 원하는 회전 각도(이 경우 45도)로 바꾸세요.
CSS 예:
.red-box { background-color: red; transform: perspective(600px) rotateY(45deg); }
HTML 코드:
요소에 기울이기를 적용하려면 다음 클래스를 추가합니다.
외부 리소스의 예:
제공된 CSS 및 HTML 코드는 http://desandro.github.com/3dtransforms/docs에서 파생됩니다. /perspective.html. 이 웹사이트는 원근 변환 사용에 대한 추가 예제와 문서를 제공합니다.
부인 성명: 제공된 모든 리소스는 부분적으로 인터넷에서 가져온 것입니다. 귀하의 저작권이나 기타 권리 및 이익이 침해된 경우 자세한 이유를 설명하고 저작권 또는 권리 및 이익에 대한 증거를 제공한 후 이메일([email protected])로 보내주십시오. 최대한 빨리 처리해 드리겠습니다.
Copyright© 2022 湘ICP备2022001581号-3