CSS3動畫全屏

我發現了一個非常有用的登錄窗體示例：https://codepen.io/Lewitje/pen/BNNJjo 但它的高度限制爲400px。我想讓背景變成全屏。我改變了高度100%，但我有動畫問題。

@-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聲明那裏的箱子，飛行高度在前看不見。爲了使背景全屏，我需要改變這一點。我試着加入-100%但它不工作。

你能幫我嗎？

來源

2016-07-07 Miljan Ilic

嘗試使用100vh代替 –

它的工作原理，太感謝你了。 –

很高興幫助！我會寫它作爲未來偏好的答案。 –

嘗試使用100vh代替。

約視窗相對長度更多信息here

來源

2016-07-07 20:58:39

回答

相關問題