li高度设置无效的问题

设置li元素的高度无效的解决办法就是为li加入:overflow:hidden;

 

 
  <! 
  DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" 
  > 
  
 
  < 
  html  
  xmlns 
  ="http://www.w3.org/1999/xhtml" 
  > 
  
 
  < 
  head 
  > 
  
 
  < 
  meta  
  http-equiv 
  ="Content-Type" 
   content 
  ="text/html; charset=utf-8" 
    
  /> 
  
 
  < 
  title 
  >无标题文档 
  </ 
  title 
  > 
  
 
  < 
  style  
  type 
  ="text/css" 
  > 
  
    
    ul 
  { 
  
        list-style 
  : 
  none 
  ; 
  
        float 
  : 
  left 
  ; 
  
     
  } 
  
    li 
  { 
  
        overflow 
  : 
  hidden 
  ; 
    
  /* 
  解决高度设置无效的问题 
  */ 
  
        float 
  : 
  left 
  ; 
  
        width 
  : 
  12px 
  ; 
  
        height 
  : 
  12px 
  ; 
  
        background 
  : 
  red 
  ; 
  
        margin-right 
  : 
  4px 
  ; 
  
     
  } 
  
 
  </ 
  style 
  > 
  
 
  </ 
  head 
  > 
  
 
  
 
  < 
  body 
  > 
  
     
  < 
  ul 
  > 
  
         
  < 
  li 
  ></ 
  li 
  > 
  
         
  < 
  li 
  ></ 
  li 
  > 
  
         
  < 
  li 
  ></ 
  li 
  > 
  
         
  < 
  li 
  ></ 
  li 
  > 
  
         
  < 
  li 
  ></ 
  li 
  > 
  
         
  < 
  li 
  ></ 
  li 
  > 
  
     
  </ 
  ul 
  > 
  
 
  </ 
  body 
  > 
  
 
  </ 
  html 
  >