1. 你曾經說想要 高度佔頁面或佔div百分比無效的問題，相信你也搜尋過了，就是說 需要 設定父親父親一直到祖宗html都必須設定百分比，才有效果。
一句話：想用百分比設定他的高度，則它的父親中至少有一個是固定高度，不然的話全部父親直到祖宗html（因為html外面就是瀏覽器，它是有高度的）都必須設定上百分比。 當然要排除那些脫離文件流的div,例如position:absolute,fixed，可以認為他們的父級就是瀏覽器，所以height百分比總是有效的，因為瀏覽器的高度是可以直到的啊。
2. 有時候並不是直接用百分比，可能有部分margin啊，padding啊需要扣除掉，這時候可以用height: calc(100% - 1rem); height: calc(50% - 2px ); 等等，這種情況有效的條件也是必須是第一點說明的，因為它也是用到了height百分比啊。
在現今響應式佈局的要求下，許多能自動調整尺寸的元素能夠做到高寬自適應，如img，透過{width:50%;height:auto;}實現圖片高度跟隨寬度比例調整。
然而，用的最多的標籤一哥Div卻不能做到自動調整（要么從父級繼承，要么自行指定px，要么給百分比！但是這個百分比是根據父級的高度來計算的，根本不是根據元素本身的寬度，那麼就做不到Div的寬高達成一定的比例=-=）。
要達到此功能（div的高度：寬度=1:1），透過各種加Buff，得知有下列幾種處理方式
#1，直接指定div的寬高+zoom來實現自適應
div{width:50px;heigth:50px;zoom:1.1;}
這樣能達到初步的等寬高div，但是限制太大， PASS！
2，透過js動態判斷div的寬度來設定高度
div{width:50%;}
window.onresize = function(){div.height( div.width);}
也能實現等寬高div，但是總覺得有點彆扭，PASS！
3，透過寬高單位來設定
div{width:20vw;height:20vw;/*20vw為viewport width的20%*/}
但是很多設備不支援這個屬性，相容性太差，PASS！
4，透過float來設定
#aa{background:#aaa;;}
#bb{background:#ddd;;float:left}
##cc{ background:#eee;;float:right}
以上是高度佔頁面或佔div百分比無效是什麼情況？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
