好得很程序员自学网

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

css笔记:如何将一个页面平均分成四个部分?-高小斯

今天,我在刷面试题的时候,突然想到一道题:如何将一个页面平均分成四个部分(div)呢?其实难度也不大,于是直接上代码

  1     DOCTYPE html  > 
  2     html   lang  ="en"  > 
  3     head  > 
  4         meta   charset  ="UTF-8"  > 
  5         title  > 将页面平均分成四部分   title  > 
  6         style   type  ="text/css"  > 
  7           *  { 
  8               margin  :   0  ; 
  9               padding  :   0  ; 
 10           } 
 11           .main  { 
 12               width  :   100%  ; 
 13               height  :   100%  ; 
 14               position  :   absolute  ; 
 15           } 
 16           .quarter-div  { 
 17               width  :   50%  ; 
 18               height  :   50%  ; 
 19               float  :   left  ; 
 20           } 
 21           .blue  { 
 22               background-color  :   #5BC0DE  ; 
 23           } 
 24           .green  { 
 25               background-color  :   #5CB85C  ; 
 26           } 
 27           .orange  { 
 28               background-color  :   #F0AD4E  ; 
 29           } 
 30           .yellow  { 
 31               background-color  :   #FFC706  ; 
 32           } 
 33         style  > 
 34     head  > 
 35     body  > 
 36         div   class  ="main"  > 
 37             div   class  ="quarter-div blue"  >  div  > 
 38             div   class  ="quarter-div green"  >  div  > 
 39             div   class  ="quarter-div orange"  >  div  > 
 40             div   class  ="quarter-div yellow"  >  div  > 
 41         div  > 
 42     body  > 
 43     html  >  

查看更多关于css笔记:如何将一个页面平均分成四个部分?-高小斯的详细内容...

  阅读:52次