問題描述

我現(xiàn)在想實(shí)現(xiàn)一個(gè)p的高度為100vh再減去導(dǎo)航欄的64px,使用min-height:calc( 100vh - 64px )為什么在瀏覽器上得出36vh的結(jié)果，并不是我想要的結(jié)果，請(qǐng)問一下要怎么設(shè)置才能得到想要的結(jié)果

問題解答

說說我的做法吧，雖然不知道你的結(jié)構(gòu)，不過我能80%的肯定你的結(jié)構(gòu)如下

<nav>導(dǎo)航</nav><main>主內(nèi)容</main>

nav + main的高度最少為100vh，nav固定為64px對(duì)吧？

這個(gè)結(jié)構(gòu)總得有個(gè)外部容器吧？我先暫且認(rèn)為這個(gè)外部容器是body,

一種辦法就是

body { min-height: 100vh; display: flex; flex-direction: column;}nav { height: 64px;}main { flex: 1 1 0;}

其實(shí)還有很多別的辦法，不過各有各的缺陷，這個(gè)也有缺陷，就是不知道適不適合你。

好吧！我想說的是，你最好把你的結(jié)構(gòu)和想要實(shí)現(xiàn)的效果都表達(dá)出來，否則我只能揣測(cè)著回答你，蠻浪費(fèi)時(shí)間。