學習地址-http://zh.learnlayout.com

1. 使用max-width來代替width
2. 設置盒模型 box-sizing: border-box
3. 關于固定定位 position:fixed
   1. 使用<header> <footer> 后要確保有足夠空間來顯示body內容，給body設置margin-top與margin-bottom
   2. 待續...
4. 百分比寬度可以用來為圖片設置寬高，這樣就可以根據其父元素寬高變化而變化，父元素寬度用max-width
5. 更好的實現響應式布局可以用媒體查詢@media screen and (min-width:600px) {}
6. 實現文字的多列布局 下面是3列布局

.three-column {
  padding: 1em;
  -moz-column-count: 3;
  -moz-column-gap: 1em;
  -webkit-column-count: 3;
  -webkit-column-gap: 1em;
  column-count: 3;
  column-gap: 1em;
}

7. 移動端input placeholder 偏上問題 line-height:normal