css 佈局經常使用屬性總結

佈局目前學習了一下幾種

1.position佈局

      position有absolute relative fixed static inherit等屬性值，

     absolution：絕對定位，相對於除了static之外的父元素進行定位；

     relative：相對定位，相對於元素正常位置進行定位；

     fixed：絕對定位，相對於瀏覽器窗口進行定位；

     inherit：繼承父類；

     position定位在不少框架佈局中都有應用 我就不一一介紹了，自行去看ionic的佈局，body採用的就是        position進行佈局，好比body大小變成窗口大小能夠設置成 top：0；bottom：0；left:0;right:0;

     這樣一來就能夠造成一個總體的佈局；好比常見的三列布局 兩列布局等 均可以用position去實現；

    另外position 用於某一個元素的時候，子元素的offsetParent 是至關於父元素的；沒有定位的時候是相       對於根節點的；

2.display：flex

   flex是彈性佈局，具體參考阮一峯寫

    http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool；

3.display：table

   顯示成表格形式；子元素要設置成display：row ;display：column；vertical-align:middel能夠讓內容居中；

4.display：inline-block;

   塊級預算按照行內元素排列；行內元素通常都是按行排列行內預算又稱爲內聯元素，內聯元素若是嵌入了文本的話  對其的基線會改變；主要是line-height和vertical-align搞得鬼；因此只要設置vertical-align能夠對齊元素；

5.BFC IFC

   BFC:塊級格式化上下文，通常處理 margin重疊  浮動，自適應佈局；具體參考

http://www.cnblogs.com/lhb25/p/inside-block-formatting-ontext.html

  IFC：內聯格式化上下文具體參考

  http://www.jshacker.com/note/3608

6.減小div嵌套，每一層div都要有必定的意義

7.float佈局 ：float須要清除浮動