前端知识整理 CSS盒模型

我们先来说说 什么是CSS的盒模型呢？

百度一下：

想象一个盒子，它有：外边距（margin）、边框（border）、内边距（padding）、内容（content）四个属性；

好百度是这样解释的。

行 但是我们还有两个小概念 一个是标准模型（content-box） 和IE模型  （border-box）

这两个有什么区别呢？就是一个块的宽高 标准一个是 content  一个 还要加上 内边距和边框 （字面意思）

那么，我们怎么来获得盒子模型的宽和高呢？

1. dom.style.width (只适用于内联样式)

2. dom.currentStyle.width(不兼容)

3. window.getComputedStyle(dom).width(不太懂)

4.dom.getBoundingClientRect().width（不太懂）