一、怪異盒模型
（一） box-sizing：content-box（標準盒模型）/border-box（怪異盒模型/ie盒模型
）允許以特定的方式定義匹配某個區域元素的特定元素
1.content-box這是由css2.1規定的寬度高度行為；
寬度和高度分別應用到元素的內容框；
在寬度和高度之外繪製元素的內邊距和邊框
2.border-box：為元素設定的寬度和高度決定了元素的邊框盒；
就是說，為元素指定的任何內邊距和邊框都將在已設定的寬度和高度內進行繪製；
通過從一設定的寬度和高度分別減去邊框盒內邊距才能得到內容的寬度和高度
怪異盒模型 彈性盒模型
標準盒模型 我們平常狀態下所寫的，即為標準盒模型狀態下的css樣式 box怪異盒模型 ie盒模型 p box兩種模式的區別標準模式會被設定的padding撐開，而怪異模式則相當於將盒子的大小固定好，再將內容裝入盒子。盒子的大小並不會被padding所撐開。標準模式 box sizing conten...
標準盒模型 怪異盒模型
盒子模型的組成 盒子模型一般由 內容 content 邊框 border 左右外邊距 margin left margin right 左右內邊距 padding left padding right 這些部分組成。css中盒子模型分為兩種 w3c標準盒模型和ie標準盒模型 標準盒子模型 標準盒模型...
標準盒模型 怪異盒模型 彈性盒模型
box sizing content box 標準盒模型 標準盒模型總寬度 border2 padding2 content box sizing border box 怪異模式 怪異盒模型的總寬度 width margin 左右 width已經包含了padding和border值 flex dir...