分析div自動適應瀏覽器的高度
|
前端人員之間有一個普遍存在的問題，如何讓一個div的高度自動延伸到瀏覽視窗100%的高度,在佈局中，我們有時會用到高度自適應，例如，我們定義了一個 div，並且希望它的高度為視窗高度的100% ，那麼我們該如何編寫程式碼呢？用height:100%就可以了。但要注意的是，瀏覽器對css的解析方式有一點差異。我們需要弄清楚100% 到底是誰佔誰的100%，讓我給你另外一種方式來思考HTML，幾乎每一個HTML檔案都有一組容器彼此包含的。因此，在我們的頁面裡面，首先我們有一個<html>容器，其次<body>容器包含在<html>裡，最後才是<div
id=”content”></div>容器包含在裡面。當我們往任何一個容器裡面放置內容的時候，這個容器和包含此容器的父容器盒子都會自動延伸的，從而能容下這些新新增的內容。也就是說，當我們往<div id=”content”></div>容器盒子新增文字內容的時候，這個div容器盒子是自動延伸的，包含這個div容器的父容器盒子（body與html）依次是自動延伸的。 |