? ? ? ? 前言：在網(wǎng)頁設(shè)計中，常常遇到需要設(shè)置最小高度的問題。例如，設(shè)計方案中需要給一個div設(shè)置一個背景圖，而該div并不限定具體寬高值，其內(nèi)部內(nèi)容無法撐開背景圖完全顯示所需要的高度，此時便需要設(shè)置最小高度。即當div內(nèi)的內(nèi)容無法撐開父級高度時，會有一個最小高度保證父級背景顯示完全，而當內(nèi)容高度大于最小高度時，該div的高度就會完全由內(nèi)容撐開。這里邊要用到css的一個屬性，即min-height。

? ? ? ? 但是一般好用的東西都存在兼容性問題，min-height存在一個兼容性問題-不兼容IE6。代碼演示如下：

? ? ? ? html代碼：

<div class="box"><h1>測試min-height兼容性</h1></div>

? ? ? ?css代碼：

body,h1{margin:0;}.box{min-height:775px;background:url(../min-hight.jpg) no-repeat 0 0;}h1{font:14px/7 "微軟雅黑";color:#000;}? ? ?

? ? ? ? ?其中背景圖片是在百度上隨便下載的一張1024*775的圖片。代碼演示結(jié)果在Chrome下顯示如下：

? ? ?

? ? ? ? ?其在ie6（使用ietest進行模擬）下顯示效果如下：

? ?

? ? ?在ie6設(shè)置最小高度，需要對div的css代碼做如下修改：

.box{min-height:775px;height:775px;height:auto !important;background:url(../min-hight.jpg) no-repeat 0 0;}

? ? ? 在ie6下，限定高度為775px，當內(nèi)容高度大于775px時，便會由內(nèi)容撐開。設(shè)置height：auto!important；是為了在除ie以外的瀏覽器中，覆蓋height：775px這個樣式。！important所在css樣式會比其他css樣式優(yōu)先級最高。但也需要注意！important的合理使用，特別是在協(xié)作開發(fā)的時候，需謹慎。

? ? ?改進代碼后，在ie6下顯示效果如下圖所示：

? ??

總結(jié)

以上是生活随笔為你收集整理的兼容浏览器的最小高度(min-height)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。