【HTML/CSS】什麼是盒子模型
CSS盒子模型就是在網頁設計中常常用到的CSS技術所使用的一種思惟模型。網頁設計中常聽的屬性名：內容(content)、內邊距(padding)、邊框(border)、外邊距(margin)，CSS盒子模式都具有這些屬性。
盒模型一共有2種模式
- 符合W3C標準的標準盒模型
標準盒子的長寬 = content的長寬html
- 在IE下的怪異盒模型
怪異盒子的長寬 = content的長寬+ padding + border瀏覽器
在html的首部，咱們常常會看到一個<!Doctype html>的聲明，瀏覽器根據這個聲明來判斷這個文件是什麼類型的，並根據這來判斷怎麼解析文件。spa
- 當咱們寫了<!Doctype html>的聲明的時候，不管在哪一種內核的瀏覽器下盒子模型都會被解析爲標準盒模型
- 當咱們沒寫聲明或聲明丟失的時候，部分有IE內核的瀏覽器則會觸發怪異模型(IE6,7,8)
- 在CSS3中咱們能夠經過設置box-sizing的屬性來完成標準或者怪異模式之間的切換
（1）box-sizing ： content-box 採用標準模式 也是默認樣式
（2）box-sizing： border-box 採用怪異模式
以上就是我對盒子模型的理解，若有異議歡迎評論留言。
相關文章
- 1. 什麼是盒子模型
- 2. 盒子模型是什麼？
- 3. 【什麼是盒模型】標準盒子模型、怪異盒子模型
- 4. 什麼是CSS的盒子模型
- 5. 什麼是盒模型
- 6. 什麼是盒模型？
- 7. CSS----什麼是盒模型
- 8. 什麼是css盒模型？
- 9. 什麼是CSS盒模型 IE盒模型和W3C盒模型
- 10. 什麼是盒模型（標準盒模型，怪異盒模型）
- 更多相關文章...
- • Hibernate是什麼 - Hibernate教程
- • MyBatis是什麼 - MyBatis教程
- • 委託模式
- • Kotlin學習（二）基本類型
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. 什麼是盒子模型
- 2. 盒子模型是什麼？
- 3. 【什麼是盒模型】標準盒子模型、怪異盒子模型
- 4. 什麼是CSS的盒子模型
- 5. 什麼是盒模型
- 6. 什麼是盒模型？
- 7. CSS----什麼是盒模型
- 8. 什麼是css盒模型？
- 9. 什麼是CSS盒模型 IE盒模型和W3C盒模型
- 10. 什麼是盒模型（標準盒模型，怪異盒模型）