? ? ? ? ?WEP前端敲代碼的時(shí)候經(jīng)常會說“這里給了盒子，那里給個(gè)盒子”，到底這個(gè)盒子是什么呢？

? ? ? ? ?其實(shí)盒模型大致可以分為兩種，一種是標(biāo)準(zhǔn)盒模型，一種是怪異(IE)盒模型。

首先我們來看一張圖片，這是從某個(gè)網(wǎng)址截的圖

盒模型

? ? ? ? 從圖上我們能看到三個(gè)值：margin(外邊距，border(邊框)，padding（內(nèi)邊距），其次還會有width（寬），height（高）；

那么一個(gè)標(biāo)準(zhǔn)盒模型的文本內(nèi)容content由什么組成呢---------content=width+height

? ? ? ? ?如果是一個(gè)怪異（IE）盒模型的文本內(nèi)容呢？

? ? ? ? content = width + height + padding + border

既然有兩種盒模型，那么它們倆可以互相轉(zhuǎn)換嗎，答案肯定是可以的·········

box-sizing: content-box; w3c標(biāo)準(zhǔn)盒模型

box-sizing:border-box; IE盒模型

盒模型轉(zhuǎn)換也會幫你解決一些盒子周邊出現(xiàn)的問題。