好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

DIV内容垂直居中-MySomeDay

css垂直居中属性设置vertical-align: middle对div不起作用,例如:

  1     DOCTYPE html  > 
  2     html   lang  ="zh-CN"  > 
  3     head  > 
  4     meta   charset  ="utf-8"  > 
  5     meta   http-equiv  ="X-UA-Commpatible"   content  ="IE=edge"  > 
  6     title  > DIV垂直居中对齐   title  > 
  7     style   type  ="text/css"  > 
  8   *   { 
  9       margin  :   0  ; 
 10       padding  :   0  ; 
 11   } 
 12  
 13   html, body   { 
 14       width  :   100%  ; 
 15       height  :   100%  ; 
 16   } 
 17  
 18   body   {  text-align  :   center  ;   vertical-align  :   middle  ;  } 
 19   .outer   { 
 20       width  :   400px  ; 
 21       height  :   120px  ; 
 22       position  :   relative  ; 
 23       left  :   20px  ; 
 24       top  :   20px  ; 
 25       text-align  :   center  ; 
 26       vertical-align  :   middle  ; 
 27       border  :   1px dashed blue  ; 
 28   } 
 29  
 30   .button   { 
 31       width  :   200px  ; 
 32       height  :   40px  ; 
 33   } 
 34     style  > 
 35     head  > 
 36     body  > 
 37         div   class  ='outer'  > 
 38             button   class  ='button'  > 在DIV中垂直居中   button  > 
 39         div  > 
 40     body  > 
 41     html  >  

查看更多关于DIV内容垂直居中-MySomeDay的详细内容...

  阅读:37次