一個盒子分為4個部分：

• content 內(nèi)容區(qū)
• border 邊框
• padding 內(nèi)邊距

• margin 外邊距

  
  
  盒子模型
  
  

  內(nèi)容區(qū)：
  存放內(nèi)容也就是元素
  通過width和height設(shè)置內(nèi)容區(qū)塊大小
  內(nèi)邊距：
  padding:10px 20px 30px 40px; 指定內(nèi)邊距大小上→右→下→左的順序
  padding:10px 20px 30px; 指定內(nèi)邊距大小上→左右→下的順序
  padding:10px 20px; 指定內(nèi)邊距大小上下→左右的順序
  padding:10px; 同時指定內(nèi)邊距大小的四個方向
  邊框：
  border:1px red solid; 指定了寬，顏色和樣式
  邊框的樣式：

• none 沒有邊框
• dotted 點狀虛線
• dashed 虛線
• solid 實線
• double 雙實線
• groove 槽線
• ridge 脊線
• inset 凹邊
• outset 凸邊
  外邊距：
  margin設(shè)置元素邊框與周圍元素相距的空間
• top 上邊距
• right 右邊距
• bottom 下邊距
• left 左邊距
• auto 自動
• margin:0 auto 可以使元素居中
  display：
  我們不能為內(nèi)聯(lián)元素設(shè)置width、height、margin-top、margin-bottom但是我們可以通過disply來修改內(nèi)聯(lián)元素的性質(zhì)
• block 設(shè)置元素為塊
• inline 設(shè)置元素為行內(nèi)元素
• inline-block 設(shè)置元素為行內(nèi)塊
• none 隱藏元素
  visibility：
  主要用于元素是否可見
  與display的區(qū)別：display隱藏元素，隱藏后的元素所站位置不存在；visibility隱藏元素，但是元素所占位置還在
• visible 可見的
• hidden 不可見的
  overflow：
  當(dāng)相關(guān)元素中的內(nèi)容溢出后可以通過overflow來控制溢出情況
• visible 默認(rèn)值
• scroll 添加滾動條
• auto 根據(jù)需要自動添加滾動條
• hidden 隱藏溢出的內(nèi)容