自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

完美實現(xiàn)控制DIV最小高度和DIV自適高度

開發(fā) 前端
我們在用DIV布局的時候經(jīng)常會遇到這樣的一種情況:我們需要設(shè)置一個div高度,當里面的東西超過這個高度時,讓這個容器自動被撐開,這是什么原因呢?請看本文詳細介紹。

本文和大家重點討論一下如何控制DIV最小高度又DIV自適高度問題,如果我們需要設(shè)置一個div高度,當里面的東西超過這個高度時,讓這個容器自動被撐開,也就是DIV自適應(yīng)高度。當里面的信息很少時候,我們就設(shè)置它一個最小的固定高度。

如何控制DIV最小高度又DIV自適高度

我們在用div布局的時候經(jīng)常會遇到這樣的一種情況:我們需要設(shè)置一個DIV高度,當里面的東西超過這個高度時,讓這個容器自動被撐開,也就是DIV自適應(yīng)高度。當里面的信息很少時候,我們就設(shè)置它一個最小的固定高度。

我們知道,在IE6中,如果子容器的高度超過父容器的時候,父容器會被子容器撐開,所以我們可以直接設(shè)置一個height的高度值即可。但是在IE7和firefox就不行了,它不會自動撐開。

如果要設(shè)置DIV自適應(yīng)高度,我們可以采用height:auto;這個屬性;不過這個屬性IE6又不支持了。是不是很頭痛?其實解決這個問題不難,而且方法也不少,這里推薦一種:(假設(shè)我們需要控制的這個DIV最小高度是100px,超過時就讓里面的信息自動撐開): 

  1. .div{  
  2.  
  3. height:auto!important;  
  4.  
  5. height:100px;  
  6.  
  7. min-height:100px  
  8.  
  9. }  

 注釋:因為!important在IE7和Firefox都可以讀到,而且權(quán)重高于后面的height:100px;所以當在IE7和Firefox顯示的時候,就會用了前面的height:auto!important;而IE6識別不了!important,auto對它也不管用,因此會應(yīng)用了后面的height:100px的樣式;而min-height:100px表示DIV最小高度為100px;此屬性在IE7和firefox都可以識別。

這樣一個完美的即可以設(shè)置DIV最小高度,又可以DIV自適應(yīng)高度的css樣式就出來了,同時兼容了IE6、IE7和firefox!

【編輯推薦】

  1. DIV+CSS滑動門技術(shù)簡介
  2. DIV自適應(yīng)高度寫法簡介
  3. 14大CSS工具提高網(wǎng)頁設(shè)計效率
  4. 實現(xiàn)DIV圖片居中方法揭秘
  5. 鼠標經(jīng)過時改變DIV背景顏色的三種途徑

 

責任編輯:佚名 來源: anke1460
相關(guān)推薦

2010-09-15 13:14:04

DIV控制

2010-08-26 15:08:08

DIV高度

2010-09-09 10:37:39

CSSdiv列高度

2010-09-03 15:40:42

最小高度DIVCSS

2010-09-09 16:58:14

CSSmin-height

2010-08-30 10:26:20

DIV自適應(yīng)高度

2010-08-30 09:52:03

DIV高度自適應(yīng)

2010-08-30 09:22:13

DIV高度自適應(yīng)

2010-08-24 16:03:22

Div高度

2010-08-19 15:04:26

IE6DIV

2010-08-18 15:10:44

IE7IE8Firefox

2010-08-26 14:18:25

DIV高度

2010-08-30 09:15:15

DIV高度自適應(yīng)

2010-08-25 13:10:43

div高度CSS

2010-08-18 16:10:35

IE6CSS

2010-09-10 12:59:33

DIV嵌套CSS

2010-08-24 12:40:23

DIVCSSmin-height

2010-09-10 09:51:05

DIVCSS

2012-05-07 13:41:18

JavaScript

2010-09-09 14:21:27

CSS盒模型
點贊
收藏

51CTO技術(shù)棧公眾號