CSS样式里的padding和margin是什么意思,有何作用

Question

如题所述

Answer 1

Padding:这个简写属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算；因此，如果一个元素既有内边距又有背景，从视觉上看可能会延伸到其他行，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。值 描述

* padding-top
* padding-right
* padding-bottom
* padding-left

设置内边距。

值可以是：

* 百分比（基于父元素宽度的百分比）
* 长度值（固定的padding值）
Margin:这个简写属性设置一个元素所有外边距的宽度，或者设置各边上外边距的宽度。

块级元素的垂直相邻外边距会合并，而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地，浮动元素的外边距也不会合并。允许指定负的外边距值，不过使用时要小心。
值 描述

* margin-top
* margin-right
* margin-bottom
* margin-left

设置针对边距的属性。

值可以是：

* 百分比（基于父对象总高度或宽度的百分比）
* 长度值（定义一个固定的边距）
* auto（浏览器设定的值）。

默认值：未定义。

Answer 2

检索或设置对象四边的补丁边距。
如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
如果只提供一个，将用于全部的四条边。
如果提供两个，第一个用于上－下，第二个用于左－右。
如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
不允许负值。
对应的脚本特性为padding。请参阅我编写的其他书目。
关于对象的尺寸与边框，内外补丁等样式表属性的关系，请参看图例以及height和width属性。

Answer 3

padding是四边的填充距离，注意是内部。margin是两个或几个块之间的距离，注意是外部。你可以实验下

Answer 4

margin是外间距，不计算在元素长宽里面。padding是内间距，算在元素的长宽里面的。本回答被网友采纳