Login
网站首页 > 文章中心 > 其它

margin-left和padding-left_margin与padding区别

作者:小编 更新时间:2023-07-27 18:14:42 浏览量:67人看过

一、padding

1、语法结构

(1)padding-left:10px; 左内边距

(2)padding-right:10px; 右内边距

(3)padding-top:10px; 上内边距仿凳喊

(4)padding-bottom:10px; 下内边距

(5)padding:10px; 四边统一内边距

(6)padding:10px 20px; 上下、左右内边距

(7)padding:10px 20px 30px; 上、左右、下内边距

(8)padding:10px 20px 30px 40px; 上、右、下、左内边距

二、margin

(1)margin-left:10px; 左外边距

(粗早2)margin-right:10px; 右外边距

(3)margin-top:10px; 上外边距

(4)margin-bottom:10px; 下外边距

(5)margin:10px; 四边统一外边距

(6)margin:10px 20px; 上下、左右外边距

(7)margin:10px 20px 30px; 上、左右、下外边距

(备野8)margin:10px 20px 30px 40px; 上、右、下、左外边距

通俗地说——

padding 就是内容与边框的距猛尘灶离;

margin 就是边框与其枝扮他元素的距兄链离。

盒模型的外边距和内边距:判告厅

margin是对外的,padding是对内的。

margin在一个声明中设置所有外边距属性。

margin-bottom设置元素的下外边距。

margin-left设置元素的左外边距。

margin-right设置元素的右外边距。

margin-top设置元素的上外边距。

2.margin样式的掘隐简写方式,padding同理:

例子 1

margin:10px 5px 15px 20px;

上外边距是 10px

右外边距是 5px

下外边距是 15px

左外边距是 20px

例子 2

margin:10px 5px 15px;

右外边距和左友搭外边距是 5px

例子 3

margin:10px 5px;

上外边距和下外边距是 10px

右外边距和左外边距是 5px

例子 4

margin:10px;

所有 4 个外边距都是 10px

CSS中margin和padding有以下三方面区别。

在CSS中margin是指从自身边框到另一个容器边框之间的距离,就是容器外距离。在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离,就是容器内距离。源春掘

1、语法结构。

padding:

padding-left:10px; 左内边距、padding-right:10px; 右内边距、padding-top:10px; 上内边距、padding-bottom:10px; 下内边距。

margin:margin-left:10px; 左外边距、margin-right:10px; 右外边距、margin-top:10px; 上外边距、margin-bottom:10px; 下外边距。

2、可能取的值。森猜

padding:length规定具体单位记的内边距长度、%基于父元素的宽度的内边距的长度、auto浏览器计算内边距、inherit 规定应该从父元素继承内边距。

margin:length 规定具体单位记的外边距长度、%基于父元素的宽度的外边距的长度、auto浏览器计算外边距、inherit 规定应该从雹核父元素继承外边距。

3、浏览器兼容问题。

padding:所有浏览器都支持padding属性、任何版本IE都不支持属性值"inherit"。

margin:所有浏览器都支持margin属性、任何版本IE都不支持属性值"inherit"

left是层位置属性设置,padding-left是层距离层左边距离设置

padding-left 属性设置元素左内边距(空白)。

该属性设置元素左内边距的宽度。行内非替换元素上设置的左内边距仅在元素所生成的第一个行内框的左边出现.

注释:不允许使用负值。

margin-left

语法

margin-left:[ | | auto ]{1,4}

默认值: 0

相关属性:[margin ] || [ margin-top ] || [ margin-right ] || [ margin-bottom ]

取值

auto:

值被设置为相念友森对仔亩边的值

用长度值来定义外补白。可以为负值

用百分比来定义外补告世白。可以为负值

以上就是土嘎嘎小编大虾米为大家整理的margin-left和padding-left_margin与padding区别相关主题介绍,如果您觉得小编更新的文章对您有所帮助,不要忘记讲本站分享给您身边的朋友哦!!

版权声明:倡导尊重与保护知识产权。未经许可,任何人不得复制、转载、或以其他方式使用本站《原创》内容,违者将追究其法律责任。本站文章内容,部分图片来源于网络,如有侵权,请联系我们修改或者删除处理。

编辑推荐

热门文章