一直不懂height:100%和height:auto的差別,最近在製作前端頁面時都用了height:100%;overflow:hidden; ,可是有些瀏覽器出現莫名的奇妙的問題,但換成height:auto就好了,百度過這個問題,卻一直沒有細看。
今天又浮現了同樣的問題,百度細看和群組裡的朋友指點,終於明白其中的道理,記錄一下。
height:auto,是指根據區塊內內容自動調整高度。
height:100%,是指其相對父塊高度而定義的高度,也就是按照離它最近且有定義高度的父層的高度來定義高度。
auto是隨內容的高度撐開的。 100%是根據父級元素的高度來決定的。例如:
<div style="height:100px;width:200px;"> <div style="height:auto;width:100px;float:left;"> 这个容器的高度是随里面的内容的高度而定 </div>
<div style="height:100%;width:100px;float:right;">这个容器的高度为父级的高度,100px</div> </div>
例如一個表格在另一個表格裡面,如果外面的表格高是100,裡面表格當是auto的時候,如果表格裡面沒有東西,它就沒有高度,表格裡面的內容有多高,它就有多高,而當是100%的時候,無論裡面有沒有內容,它都和外面的表格是一樣高的
以上是height:100%和height:auto到底有什麼差別?的詳細內容。更多資訊請關注PHP中文網其他相關文章!