margin:

margin:5px auto;意思上下为5,左右平均居中
margin-top: 20px; 上外边距                        
margin-right: 30px; 右外边距
margin-bottom: 30px;下外边距                                                      
margin-left: 20px; 左外边距
margin:1px 四边统一边距
margin:1px 1px 上下边距,左右边距
margin:1px 1px 1px 上,左右,下边距
margin:1px 1px 1px 1px 上,右,下,左边距
注释:允许使用负值。
例子
1.margin:10px 5px 15px 20px;上外边距是 10px
右外边距是 5px
下外边距是 15px
左外边距是 20px
例子 2margin:10px 5px 15px;上外边距是 10px
右外边距和左外边距是 5px
下外边距是 15px
例子 3margin:10px 5px;上外边距和下外边距是 10px
右外边距和左外边距是 5px
例子 4margin:10px;所有 4 个外边距都是 10px
 
pading:

padding-top:20px;上内边距
padding-right:30px;右内边距
padding-bottom:30px;下内边距
padding-left:20px;左内边距
padding:1px四边统一内边距
padding:1px1px上下,左右内边距
padding:1px1px1px上,左右,下内边距
padding:1px1px1px1px上,右,下,左内边距
注释:不允许使用负值。

其实说白了padding就是内容与边框的空隙.而margin 则是模块与模块的空隙

CSS属性(pading margin)的更多相关文章

  1. CSS属性之margin

    0.对自身可视宽度的影响 1>改变处于标准文档流中,未设置width值的block元素的可视宽度 在标准文档流中,对于没有设置宽度的block元素,当其具有内容或者设置高度后,其自身宽度为父元素 ...

  2. 深入理解css中的margin属性

    深入理解css中的margin属性 之前我一直认为margin属性是一个非常简单的属性,但是最近做项目时遇到了一些问题,才发现margin属性还是有一些“坑”的,下面我会介绍margin的基本知识以及 ...

  3. 图解CSS的padding,margin,border属性

    原文出处:http://hi.baidu.com/sonan/item/af05cf8759810d1cc31627d5 觉得不错,保存以备用. --------------------------- ...

  4. 【转】图解CSS的padding,margin,border属性(详细介绍及举例说明)

    W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层.盒模型主要定义四个区域:内容(content).边框距(p ...

  5. 【转】图解CSS padding、margin、border属性

    http://www.cnblogs.com/linjiqin/p/3556497.html 图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在一个盒(b ...

  6. [转]图解CSS的padding,margin,border属性(详细介绍及举例说明)

    图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...

  7. 图解CSS的padding,margin,border属性(详细介绍及举例说明)

    图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...

  8. 解说css中的margin属性缩写方式

    <html> <body> <div style="border: 1px solid red;"> <div style="b ...

  9. 前端学习笔记之CSS属性设置

    CSS属性设置   阅读目录 一 字体属性 二 文本属性 三 背景属性 四 盒子模型 五 盒子模型各部分详解 一 字体属性 1.font-weight:文字粗细 取值 描述 normal 默认值,标准 ...

随机推荐

  1. flask(1.0)

    目录 一. 关于KeyError和IndexError 二. Python三大主流框架对比 三. flask基础 1.安装flask 2.用flask写出的第一个页面 3.Flask的Response ...

  2. vue ts ,vue使用typescript,三种组件传值方式

    参考链接:https://juejin.im/post/5c55156f6fb9a049ef270541

  3. Go语言中切片的内部实现和基础功能

    切片是一种数据结构,这种数据结构便于使用和管理数据集合.切片是围绕动态数组的概念构建的,可以按需自动增长和缩小.切片的动态增长是通过内置函数append来实现的.这个函数可以快速且高效的增长切片.还可 ...

  4. Apache——开启个人用户主页功能

    个人主页功能分为不加密和加密两种 不加密: 先来建立几个用户,我这是建了两个 例:命令为:useradd  qiyuan 然后输入:passwd qiyuan,改一下密码 我们看一下家目录下面: 已经 ...

  5. ZOJ Problem Set - 1003

    1.翻译参考 http://www.cnblogs.com/woodfish1988/archive/2006/11/10/556926.html 2.代码参考 http://www.cnblogs. ...

  6. [CF544E]Remembering Strings_状压dp

    E. Remembering Strings 题目大意: You have multiset of n strings of the same length, consisting of lowerc ...

  7. ARC100E. Or Plus Max

    题目 好题.没想出解法. 官方题解: 这个解法和 Small Multiple 那道题的解法有异曲同工之妙. 扩展 若把 $\mathsf{or}$ 改成 $\mathsf{and}$ 或者 $\ma ...

  8. Java list 转树tree的三种写法

  9. Spring4学习回顾之路06- IOC容器中Bean的生命周期方法

    SpringIOC容器可以管理Bean的生命周期,Spring允许在Bean生命周期的特定点执行特定的任务! Spring IOC容器对Bean的生命周期进行管理的过程: -通过构造器或者工厂方法创建 ...

  10. golang 客户端

    package main import ( "fmt" "io/ioutil" "net/http" ) func main() { fmt ...