margin-left - 左外边距 - css 外边距

梵高2年前 (2023-11-21)阅读数 27#技术干货

margin-left

margin-left属性设置与元素相关联的盒子模型的左外边距。这个值可以为负值。竖直排列相邻的两个盒子模型的外边距会重叠margin collapsing。在长度(width)被约束这种极少情况下，(即当所有的宽度，左边界，边界，填充内容区域和边缘都被定义，左边界会被忽略，如果被制定为auto值，会有相同的计算值。

示例

/*  values */
margin-left: 10px;  /* 绝对长度 */
margin-left: 1em;   /* 相对于字号的长度 */
margin-left: 5%;    /* 相对最近块元素的宽度 */

/* keyword values */
margin-left: auto;

/* global values */
margin-left: inherit;
margin-left: initial;
margin-left: unset;

浏览器支持


浏览器都支持`margin-left`

语法

margin-bottom:| |auto

取值

：一个固定宽度值：可以是一个绝对宽度，单位px,也可以是个相对宽度，单位em,或者相对视窗的大小，单位vh.

：百分比值。可以为负值&lt。参见

auto：水平（默认）书写模式下，其计算值取决于可用空间。表示在当前布局模式下，浏览器根据接收的左边距自动计算出外边距。

初始值	0
适用于	所有元素，除非 table \| inline-table \| table-caption 的表格类元素之外
继承性	无
动画性	是
计算值	指定的百分比、绝对长度或auto

实例

.content { margin-left:   5%; }
.sidebox { margin-left: 10px; }
.logo    { margin-left: -5px; }

内容声明：本文中引用的各种信息及资料（包括但不限于文字、数据、图表及超链接等）均来源于该信息及资料的相关主体（包括但不限于公司、媒体、协会等机构）的官方网站或公开发表的信息。部分内容参考包括:(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供参考使用,不准确地方联系删除处理！本站为非盈利性质站点,本着为中国教育事业出一份力,发布内容不收取任何费用也不接任何广告!)