怎样区分margin和padding

这是一篇高水准的经验，不才才疏学浅，不知会写当作怎么个样子，大师凑合看吧，可是有一点可以包管就是必定是有效的。

方式/步调

1. 1

   我们在进行网页建造时城市碰到为元素设心猿意马边距的环境，边距又分为内边距和外边距，即margin和padding.

   
2. 2

   查看元素的margin和padding我们需要借助Dreamweaver软件和火狐浏览器中的firebug插件。

   
3. 3

   margin和padding是在html中的盒模子的根本上呈现的，margin是盒子的外边距，即盒子与盒子之间的距离，而padding是内边距，是盒子的边与盒子内部元素的距离。

   
4. 4

   我们利用firebug查看html，当鼠标点击到响应的代码时，网页中的响应元素会酿成蓝色，紧挨着的紫色元素是padding，

   
5. 5

   蓝色部门旁边的黄色部门是元素的margin值，在元素上方是margin-top，下方是margin-bottom,左边margin-left,右边margin-right。

   
6. 6

   我们还可以借助于firebug的“结构”选项查看各个元素的表里边框。也就是上面几张图的来历，我们打开一个网页，按下f12，在firebug中查看，然后鼠标选心猿意马html中的某个元素，点击右侧的结构。

   
7. 7

   如许我们看到的一个方框，方框中注了然外边距是几多，内边距是几多。

   

注重事项

• 简单总结归纳综合一下就是margin是盒模子的外边距，padding是盒模子的内边距