html：
包括三部分，乙個是包裹整個的div，乙個是上半部分的div，乙個是下半部分的div
上部分
下部分
實現效果主要依賴於css的display屬性，設定為 display: -webkit-flex;目前支援的瀏覽器有ie10+和較新版本的firefox、chrome。
pannel的height為100vh，表示根據螢幕的大小自適應充滿整個螢幕，佔螢幕尺寸的100%，display屬性設定為-webkit-flex，預設排列順尋為水平，通過-webkit-flex-direction: column;設定為垂直排列，使div上下排列;
inner1的height設定為auto，這樣能夠使上半部分的高度根據內容自適應;
inner2的height設定為inherit屬性，這樣使得下半部分能夠根據上半部分的高度，自動適應鋪滿pannel的剩餘部分。
.panel
.inner1
.inner2
CSS 元素的高度，元素高度自適應螢幕高度
元素的高度預設是auto，被內容自動撐開 100 使得html的height與螢幕的高度相等 50 使得html的height等於螢幕的一半 若想讓乙個的高度與螢幕高度自適應，始終充滿螢幕，需要從html層開始層層新增height 100 元素沒有 margin和padding 元素有margin ...
設定iframe高度自適應螢幕高度
寫在前面 最近在搭建專案前台頁面框子的時候，把iframe設定成了固定的高度，導致不同的電腦尺寸訪問的時候，高度差異較大，故查了下，將iframe設定成自動適應螢幕高度的方式，這裡記錄下。還是直接上 吧 iframe頁面內容 div class page content style iframe i...
vue元件頁面高度根據螢幕大小自適應
網頁可見區域寬 document.body.clientwidth 網頁可見區域高 document.body.clientheight 網頁可見區域寬 document.body.offsetwidth 包括邊線的寬 網頁可見區域高 document.body.offsetheight 包括邊線的...