文章詳情頁
css - 使用 min-height:calc( 100vh - 64px )問題
瀏覽:237日期:2023-06-30 09:15:52
問題描述
我現(xiàn)在想實現(xiàn)一個p的高度為100vh再減去導(dǎo)航欄的64px,使用min-height:calc( 100vh - 64px )為什么在瀏覽器上得出36vh的結(jié)果,并不是我想要的結(jié)果,請問一下要怎么設(shè)置才能得到想要的結(jié)果
問題解答
回答1:說說我的做法吧,雖然不知道你的結(jié)構(gòu),不過我能80%的肯定你的結(jié)構(gòu)如下
<nav>導(dǎo)航</nav><main>主內(nèi)容</main>
nav + main的高度最少為100vh,nav固定為64px對吧?
這個結(jié)構(gòu)總得有個外部容器吧?我先暫且認(rèn)為這個外部容器是body,
一種辦法就是
body { min-height: 100vh; display: flex; flex-direction: column;}nav { height: 64px;}main { flex: 1 1 0;}
其實還有很多別的辦法,不過各有各的缺陷,這個也有缺陷,就是不知道適不適合你。
好吧!我想說的是,你最好把你的結(jié)構(gòu)和想要實現(xiàn)的效果都表達出來,否則我只能揣測著回答你,蠻浪費時間。
標(biāo)簽:
CSS
相關(guān)文章:
1. boot2docker無法啟動2. docker-compose中volumes的問題3. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””4. docker容器呢SSH為什么連不通呢?5. java - SSH框架中寫分頁時service層中不能注入分頁類6. dockerfile - 為什么docker容器啟動不了?7. 關(guān)于docker下的nginx壓力測試8. node.js - antdesign怎么集合react-redux對input控件進行初始化賦值9. docker安裝后出現(xiàn)Cannot connect to the Docker daemon.10. nignx - docker內(nèi)nginx 80端口被占用
排行榜

熱門標(biāo)簽
網(wǎng)公網(wǎng)安備