文章詳情頁
css - 使用 min-height:calc( 100vh - 64px )問題
瀏覽:106日期:2023-06-30 09:15:52
問題描述
我現(xiàn)在想實現(xiàn)一個p的高度為100vh再減去導航欄的64px,使用min-height:calc( 100vh - 64px )為什么在瀏覽器上得出36vh的結果,并不是我想要的結果,請問一下要怎么設置才能得到想要的結果
問題解答
回答1:說說我的做法吧,雖然不知道你的結構,不過我能80%的肯定你的結構如下
<nav>導航</nav><main>主內(nèi)容</main>
nav + main的高度最少為100vh,nav固定為64px對吧?
這個結構總得有個外部容器吧?我先暫且認為這個外部容器是body,
一種辦法就是
body { min-height: 100vh; display: flex; flex-direction: column;}nav { height: 64px;}main { flex: 1 1 0;}
其實還有很多別的辦法,不過各有各的缺陷,這個也有缺陷,就是不知道適不適合你。
好吧!我想說的是,你最好把你的結構和想要實現(xiàn)的效果都表達出來,否則我只能揣測著回答你,蠻浪費時間。
標簽:
CSS
相關文章:
1. windows - asp.net連接上mysql之后如何調(diào)用?比如下面的登錄驗證功能怎么實現(xiàn)2. 剛放到服務器的項目出現(xiàn)這中錯誤,有高手指點嗎3. css3 - Typecho 后臺部分表單按鈕在 Chrome 下出現(xiàn)靈異動畫問題,求解決4. apache - 想把之前寫的單機版 windows 軟件改成網(wǎng)絡版,讓每個用戶可以注冊并登錄。類似 qq 的登陸,怎么架設服務器呢?5. mysql - 面試題:如何把login_log表轉換成last_login表?6. javascript - nodejs實現(xiàn)異步時遇到的一個問題7. javascript - 為什么嵌套的Promise不能按預期捕獲Exception?8. javascript - 編程,算法的問題9. css - 手機qq打開網(wǎng)頁無法使用文件上傳功能?10. java - HTTPS雙向認證基礎上有無必要再進行加簽驗簽?
排行榜

熱門標簽