所謂盒子模型就是把HTML頁面中的元素看作是一個矩形的盒子剂跟，也就是一個裝內(nèi)容的容器脑蠕。每個矩形都由元素的內(nèi)容顾腊、內(nèi)邊距（padding）状勤、邊框（border）和外邊距（margin）組成危融。
內(nèi)邊距（padding）： 內(nèi)容與邊框之間的距離?
外邊距（margin）: 盒子與盒子之間的距離
? ?盒子模型的大小? ? 內(nèi)容大形访（寬高決定）+border +padding+margin
? ? 內(nèi)容大小（寬高決定）
? ? border 邊框
? ? padding? 內(nèi)邊距 填充
? ? margin? 外邊距
? ? margin-left 向右移動的距離
? ? margin-right? 向左移動的距離
? ? margin-top? 向下移動的距離
? ? margin-bottomyi? 向上移動的距離
? ? margin? 10px 20px 30px 40px
? ? ? ? ? ? 上? ? 右? 下? 左
? ? margin? 10px 20px
? ? ? ? ? ? 上下? 左右
? ? margin? 10px 20px? 30px
? ? ? ? ? ? 上? 左右? 下
? ? padding 和margin一樣
? ? 塊級標簽和行內(nèi)塊標簽水平居中 margin： 0 auto
? ? 行內(nèi)標簽水平居中? text-align:center
? ? 行內(nèi)元素豎直方向居中
? ? ? ? display: table-cell;
? ? ? ? vertical-align: middle;
padding是內(nèi)容和其邊框線之間的空間吉殃， margin是一個元素與另一個元素之間的空白辞居。width和height默認指內(nèi)容的寬度和高度。box-sizing:?border-box |padding-box|content-box(默認); //(Firefox: -moz-box-sizing Safari或?
chrome或android:-webkit-box-sizing ) -ms- IEbackground-color 用顏色填充邊框內(nèi)部的空間蛋勺，包括padding部分和虛線邊框瓦灶。
