div控制最小高度又自適高度

我們在用div佈局的時候經常會遇到這樣的一種情況:我們需要設置一個div的高度,當裏面的東西超過這個高度時,讓這個容器自動被撐開,也就是自適應高度。當裏面的信息很少時候,我們就設置它一個最小的固定高度。 我們知道,在ie6中,如果子容器的高度超過父容器的時候,父容器會被子容器撐開,所以我們可以直接設置一個height的高度值即可。但是在ie7和firefox就不行了,它不會自動撐開。 如果要設置自適應高度,我們可以採用height:auto;這個屬性;不過這個屬性ie6又不支持了。是不是很頭痛?其實解決這個問題不難,而且方法也不少,這裏推薦一種:(假設我們需要控制的這個div的最小高度是100px,超過時就讓裏面的信息自動撐開): .div{ height:auto !important; height:100px; min-height:100px } 註釋:因爲 !important在ie7和ff都可以讀到,而且權重高於後面的height:100px;所以當在ie7和ff顯示的時候,就會用了前面的height:auto !important;而ie6識別不了!important,auto對它也不管用,因此會應用了後面的height:100px的樣式;而min-height:100px表示最小高度爲100px;此屬性在ie7和firefox都可以識別。 這樣一個完美的即可以設置最小高度,有可以自適應高度的css樣式就出來了,同時兼容了ie6、ie7和firefox!
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章