`

CSS margin 属性

阅读更多

定义和用法

margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。

说明

这个简写属性设置一个元素所有外边距的宽度,或者设置各边上外边距的宽度。

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

注释:允许使用负值。

例子 1

margin:10px 5px 15px 20px;
  • 上外边距是 10px
  • 右外边距是 5px
  • 下外边距是 15px
  • 左外边距是 20px

例子 2

margin:10px 5px 15px;
  • 上外边距是 10px
  • 右外边距和左外边距是 5px
  • 下外边距是 15px

例子 3

margin:10px 5px;
  • 上外边距和下外边距是 10px
  • 右外边距和左外边距是 5px

例子 4

margin:10px;
  • 所有 4 个外边距都是 10px
默认值: 继承性: 版本: JavaScript 语法:
0
no
CSS1
object.style.margin="10px 5px"

实例

设置 p 元素的 4 个外边距:

p
  {
  margin:2cm 4cm 3cm 4cm;
  }

TIY

浏览器支持

所有浏览器都支持 margin 属性。

注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。

可能的值

值 描述
auto 浏览器计算外边距。
length 规定以具体单位计的外边距值,比如像素、厘米等。默认值是 0px。
% 规定基于父元素的宽度的百分比的外边距。
inherit 规定应该从父元素继承外边距。
分享到:
评论

相关推荐

    css margin 属性 详细使用说明

    在CSS中,margin属性是用于设置元素周围的空间,即元素的外边距。它决定了元素与其他元素或浏览器窗口边缘的距离。该属性是控制页面布局中非常重要的工具之一。 首先,margin属性可以接受任何长度单位作为值,包括...

    css中margin的缩写

    ### CSS中的Margin属性及其缩写规则 在网页设计与开发中,CSS(层叠样式表)扮演着极其重要的角色,它能够帮助开发者控制网页元素的布局、颜色、字体等样式。其中,`margin`属性是CSS中最常用的一个属性之一,用于...

    css margin属性深入解析

    CSS中的`margin`属性是一个非常关键的样式规则,它用于定义元素周围的空间,即外边距。这个属性允许开发者控制元素之间的距离,从而实现布局的美观和可读性。在深入解析`margin`属性之前,首先需要理解CSS盒模型...

    CSS重要属性之 margin 属性知识大整合(必看篇)

    CSS中的margin属性是控制元素外边距的重要工具,它能够影响元素与其它元素间的距离,从而对页面布局产生影响。本文将详细梳理margin属性相关的核心知识点。 首先,margin属性是CSS中非常重要的一个属性,它允许...

    CSS margin 属性定义边外补白

    CSS中的`margin`属性是一个非常重要的布局工具,用于设置元素周围的空间,也就是边外补白。边外补白不显示任何颜色或样式,因为它本质上是透明的,但它的作用是控制元素之间的距离,使得网页布局更加灵活和美观。 ...

    CSS margin属性介绍与用法(附margin解剖图)

    在CSS(层叠样式表)中,`margin`属性是一个非常重要的布局工具,它用于设置元素周围的外边距,也就是元素与其他元素或容器边界的空白区域。`margin`属性允许开发者控制元素之间的空间,使页面布局更加灵活和美观。...

    css中margin属性详细分析 (2).pdf

    《CSS中的margin属性详解》 在CSS样式设计中,margin属性是不可或缺的一部分,它用于定义元素周围的空白区域,也就是我们常说的外边距。通过合理使用margin,我们可以精确地控制元素之间的距离,从而达到良好的视觉...

    css中margin属性详细分析.pdf

    《CSS中的margin属性详解》 在CSS布局设计中,margin属性是不可或缺的一部分,它用于定义元素周围的空白区域,也就是我们常说的外边距。通过合理使用margin,我们可以精确控制元素之间的距离,从而达到美观的视觉...

    css中margin属性详细分析.docx

    在CSS中,margin属性是一个至关重要的概念,它用于设置元素周围的空白空间,即元素与其他元素或容器边缘之间的距离。理解margin的特性和使用方法对于创建具有良好布局的网页至关重要。 首先,margin属性可以独立...

    细说CSS中margin属性的使用

    本文着重描述关于 margin,我们日常不太容易发现的“坑”...CSS margin 属性 关于 margin 属性,有几点可能跟我们的直觉不相符: 1、如果 margin 的值是百分比,则是相对于父元素的内容盒宽度来计算的,即使 margin-to

    css中padding、margin两个重要属性的详细介绍及举例说明

    ### CSS中的Padding与Margin属性详解 #### 一、引言 在前端开发中,CSS(层叠样式表)是用于定义HTML文档外观的核心技术之一。其中,`padding`与`margin`是两个至关重要的属性,它们直接影响着网页元素的空间布局...

    css属性列表_和_属性值含义

    CSS 属性列表和属性值含义 CSS 属性列表和属性值含义是指在 CSS 样式表中使用的各种属性和它们的可能取值。了解这些属性和它们的含义是掌握 CSS 样式表编写的关键。 媒体类型(Media) CSS 样式表可以作用于多种...

    CSS常用属性列表

    本文将深入探讨CSS的常用属性,帮助您更好地理解和掌握这一核心技能。 1. **选择器**:CSS的选择器是用于匹配HTML元素的方式,如`class`、`id`、`tag name`等。例如,`.myClass`代表具有特定类名的元素,`#myID`...

    Css所有属性

    3. **尺寸属性**:`width`和`height`用于设定元素的宽度和高度,`padding`是内边距,`margin`则是外边距。 4. **布局属性**:`display`控制元素的显示方式,如块级、行内或Flexbox。`position`(静态、相对、绝对、...

    css基础-梦之都教学

    CSS margin属性** 用于设置元素的外边距,控制元素与其他元素之间的距离。 **13. CSS padding属性** 定义元素内容与边框之间的内边距,影响元素内部的空间。 **14. CSS属性索引** 提供按字母顺序排列的CSS属性...

Global site tag (gtag.js) - Google Analytics