max-width和min-height不被IE6支援的解決方法

今天帶給大家max-width和min-height不被IE6支持的解決方法。

我們常常為了設定一個頁面最小高度來實現整頁內容未充實情​​況下也顯示的美觀，有時設定圖片最大寬度不撐破設定的寬度，我們就可以設定一個最小高度使用min- height 來實現，設定最大寬度限制使用CSS屬性中max-width來實現。但是問題來了IE7以上版本支持，但只有IE6不支援min-height ，MAX-height 、max-width、min-width,怎麼辦呢？

DIVCSS5介紹一種使用css hack來解決，大家知道一般我們對物件設定寬度或高度，如果圖片或內容大於設定的寬度IE6就會撐破設定的寬度和高度，這是我們可以利用這一點加上IE6獨特CSS辨識符合「_」來解決問題

例如我們一個網頁要設定個最小高度為500px才好看，但是IE6不支援怎麼辦呢？
正好我們就利用CSS屬性從左到右讀取、從上到下的重複屬性來取代最下最右的CSS屬性值。

具體CSS代碼如下：

.div{min-height:500px;_height:500px;}

注意：一定注意順序，前者IE7以上所有IE、火狐、谷歌都支持，後者只有IE6支持辨認，正好利用了此CSS HACK和CSS讀取先後順序來解決此問題。

當然還有直接以下CSS程式碼：

.div{height: expression(this.height> 500 ? 500 : true);  max-height: 500px;}

但此CSS程式碼會造成圖片載入後無法正常顯示（圖片隨機會被縮小無法正常顯示）

所以我們建議使用min-height:500px;_height:500px;來解決IE6不能max和min屬性的問題。

相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：

駝峰命名與JS的問題解答

JS裡的布林值、關係運算子、邏輯運算子的詳解及實例

前端的js框架總結以及用途講解

以上是max-width和min-height不被IE6支援的解決方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！