Q

CSS3 전체 화면 애니메이션

2016-07-07 8 views 0 likes

0

로그인 양식에 대한 매우 간단한 예가 하나 있는데, https://codepen.io/Lewitje/pen/BNNJjo 이지만 높이는 400px로 제한됩니다. 배경을 전체 화면으로 만들고 싶습니다. 높이를 100%으로 변경했지만 애니메이션에 문제가 있습니다.
CSS3 전체 화면 애니메이션
```
@-webkit-keyframes square { 
    0% { transform: translateY(0); } 
    100% { transform: translateY(-700px) rotate(600deg); } 
} 
@keyframes square { 
    0% { transform: translateY(0); } 
    100% { transform: translateY(-700px) rotate(600deg); } 
} 
```
-700px이 disapears 비행 상자 높이를 선언

그들은으로 선언했다. 배경을 전체 화면으로 만들려면이 설정을 변경해야합니다. -100%을 추가하려고했지만 작동하지 않습니다.

도와 주시겠습니까?

2016-07-07 Miljan Ilic

+2

정말 감사합니다, 대신 –

+0

그것은 작동 100vh 사용해보십시오. –

+0

도움이 되니 기쁩니다! 나는 그것을 미래의 환경 설정에 대한 대답으로 쓸 것이다. –

A

답변

2

대신 100vh를 사용해보세요. 뷰포트 상대 길이에 대한

자세한 내용은 here

2016-07-07 20:58:39

관련 문제