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

浏览器支持

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

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


可能的值

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

CSS——margin的更多相关文章

  1. HTML CSS——margin与padding的初学

    下文引自HTML CSS——margin和padding的学习,作者fengyv,不过加入了一些个人的看法. 你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边 ...

  2. CSS Margin(外边距)

    CSS Margin(外边距)属性定义元素周围的空间. Margin margin清除周围的元素(外边框)的区域.margin没有背景颜色,是完全透明的 margin可以单独改变元素的上,下,左,右边 ...

  3. CSS margin属性取值

    margin表示一个元素的外边距.取值为正值时,表示相对于正常流离邻近元素更远,而取负值时,使其更近 但是,设置margin后,四个方向的表现形式不同 自身发生移动:top.left margin-t ...

  4. CSS Margin(外边距)

    CSS Margin(外边距) 一.简介 CSS margin(外边距)属性定义元素周围的空间. margin 清除周围的(外边框)元素区域.margin 没有背景颜色,是完全透明的. margin ...

  5. 细说 CSS margin

    作者:https://coding.net/u/zhengkenghong原文:https://blog.coding.net/blog/css-margin 细说 CSS margin 本文着重描述 ...

  6. CSS:CSS margin(外边距)

    ylbtech-CSS:CSS margin(外边距) 1.返回顶部 1. CSS margin(外边距) CSS margin(外边距)属性定义元素周围的空间. margin margin 清除周围 ...

  7. CSS margin collapsing All In One

    CSS margin collapsing All In One margin collapsing margin 塌陷 / margin 合并 会出现 margin collapsing 的 3 种 ...

  8. css margin

    css中margin边界叠加问题: 看个同方向和异方向margin重叠现象: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transiti ...

  9. HTML CSS——margin和padding的学习

    你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边距.呵呵呵,刚开始我也有点不理解,后来通过查资料学习总算弄明白了,现在我来谈一下自己对margin和paddi ...

随机推荐

  1. GlusterFS卷的优化

    GlusterFS可以通过配置选项来优化卷 配置选项 用途 默认值 合法值 network.ping-timeout    客户端等待检查服务器是否响应的持续时间,节点挂了数据不能写入 42 0-42 ...

  2. 【Java】初始化

    默认域初始化 如果在构造器中没有显示地给域赋予初值,那么就会被自动赋予默认值:数值为0,布尔值为false,对象引用为null. 无参数构造器 很多类都包含一个无参数的构造函数,对象由无参数构造函数创 ...

  3. BZOJ1018[SHOI2008]堵塞的交通——线段树

    题目描述 有一天,由于某种穿越现象作用,你来到了传说中的小人国.小人国的布局非常奇特,整个国家的交通系统可以被看成是一个2行C列的矩形网格,网格上的每个点代表一个城市,相邻的城市之间有一条道路,所以总 ...

  4. 睡前小dp-poj2096-概率dp

    http://poj.org/problem?id=2096 有n种分类,s种子系统,相互独立.每天发现一个bug等概率的属于n种分类和s种子系统. 要使发现的bug完全覆盖n种分类,s种分类,求天数 ...

  5. MT【224】反解系数

    (2011安徽省赛)$f(x)=ax^3+bx+c(a,b,c\in R),$当$0\le x \le 1$时,$0\le f(x)\le 1$,求$b$的可能的最大值. 提示:取三个点$f(0),f ...

  6. Spring详细教程

    Spring学习总结---- 一.导入Spring必须的jar包 二.简单示例入门注入一个User 1.编写User实体类 package test.Spring.helloworld; import ...

  7. AtCoder Grand Contest 018 E Sightseeing Plan

    题意: 给定三个矩形,选定三个点,答案加上第一个点出发经过第二个点在第三个点结束的方案数,只能往右或往下走. 折腾了我半个多下午的题. 设三个矩形为$A,B,C$一个思路是枚举$B$的那个点$s(x, ...

  8. JAVA8给我带了什么——流(入门)

    JAVA8有一个新功能——流.笔者简单的看一下流.然后默默的闭上眼睛.感叹一声:这不是.NET里面的Linq吗?如果你们当中有谁做过.NET程序员的话,对于流的学习其实帮助是很大的.但是要明白你现在是 ...

  9. Top sort 双队列

    #include<iostream> #include<vector> #include<queue> using namespace std; ]; int ma ...

  10. Makefile ------ .PHONY的作用

    看下面的例子 Makefile文件 .PHONY: cleanclean: rm *.o 当Makefile文件所在目录有文件名为clean的文件,命令行“.PHONY: clean”又没添加的话,执 ...