爲什麼我無法在div上看到我的背景

我有一個容器，而且我有浮動：留在它的子div內。問題是我應用float後立即：在子div上我的父div的背景完全丟失。爲什麼我無法在div上看到我的背景

<!DOCTYPE html> 
<html> 
    <head> 
    </head> 
    <body> 

     <div style="background: #CCC; width:100%; position:relative;"> 
      <div style="float:left;"> 
       This is some text 
      </div> 
     </div> 
    </body> 
</html>

有誰能告訴我該如何解決這個問題？

來源

2012-10-06 Jack

float元素沒有height除非你清除它們，低於或給予明確的height

試試這個，

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    </head> 
 
    <body> 
 

 
     <div style="background: #CCC; width:100%; height:50px;position:relative;"> 
 
      <div style="float:left;"> 
 
       This is some text 
 
      </div> 
 
     </div> 
 
    </body> 
 
</html>

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    </head> 
 
    <body> 
 
     <div style="background: #CCC; width:100%; position:relative;"> 
 
      <div style="float:left;"> 
 
       This is some text 
 
      </div> 
 
      <div style='clear:left'></div> 
 
     </div> 
 
     
 
    </body> 
 
</html>

或使用背景元素的overflow的這個技巧。

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    </head> 
 
    <body> 
 
     <div style="background: #CCC; width:100%; overflow:hidden;position:relative;"> 
 
      <div style="float:left;"> 
 
       This is some text 
 
      </div> 
 
     </div> 
 
     
 
    </body> 
 
</html>

來源

2012-10-06 14:55:55 Jashwant

啊，你打我吧...

你內心的（嵌套）div是浮動的，所以你的外div正在崩潰。您有幾種選擇：

將一張空clear DIV浮動DIV中
套用overflow:hidden風格外DIV
取下內的div和浮動外層div

來源

2012-10-06 15:00:38 bobjutsu

爲什麼我無法在div上看到我的背景

回答

相關問題