什么是盒子模型？很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來學(xué)習(xí)下，希望你能有所收獲。

讓客戶滿意是我們工作的目標(biāo)，不斷超越客戶的期望值來自于我們對這個行業(yè)的熱愛。我們立志把好的技術(shù)通過有效、簡單的方式提供給客戶，將通過不懈努力成為客戶在信息化領(lǐng)域值得信任、有價值的長期合作伙伴，公司提供的服務(wù)項(xiàng)目有：國際域名空間、虛擬主機(jī)、營銷軟件、網(wǎng)站建設(shè)、鎮(zhèn)坪網(wǎng)站維護(hù)、網(wǎng)站推廣。

盒子模型有兩種：W3C和IE盒子模型

盒子模型包括margin、border、padding、content

W3C的元素寬度=content的寬度

IE的元素寬度=content+padding+border

我個人認(rèn)為W3C定義盒子模型與IE定義的盒子模型，IE定義的比較合理，

元素的寬度應(yīng)該包含border（邊框）和padding（填充），這個和我們現(xiàn)實(shí)生活的盒子是一樣的，

W3C也認(rèn)識到自己的問題了，所以在CSS3中新增了一個樣式box-sizing，

包含兩個屬性content-box 和 border-box。

content-box  ：  width=content+padding+border

border-box：     width=width（樣式指定的寬度）

1.對于行級元素，margin-top和margin-bottom對于上下元素?zé)o效，margin-left和margin-right有效

2.對于相鄰的塊級元素margin-bottom和margin-top 取值方式

1） 都是正數(shù)： 取最大值   距離=Math.max(margin-botton,margin-top)

2） 都是負(fù)數(shù)： 取最小值   距離=Math.min(margin-botton,margin-top)

3）上面是正數(shù)，下面是負(fù)數(shù)或者 上面是負(fù)數(shù)，下面是正數(shù)： 正負(fù)相加   距離=margin-botton+margin-top

看完上述內(nèi)容是否對您有幫助呢？如果還想對相關(guān)知識有進(jìn)一步的了解或閱讀更多相關(guān)文章，請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝您對創(chuàng)新互聯(lián)的支持。