以两个并排显示的div为例说明.

现在两个div都有背景颜色, 右边的div中有几行p,

若是想要使两个div之间有间隔, 即两块带了颜色区域之间产生空隙, 则给div的css中外边距margin赋值;

若是想要右边div中的p与右边div的边界有一定距离, 则给div的内边距padding复制.

通过这个栗子就能比较好的区分margin和padding的用法了.

区分内边距与外边距padding和margin的更多相关文章

  1. padding和margin——内边距和外边距

    一.padding——内边距(内填充) 1.1.padding 简写属性在一个声明中设置所有填充属性.该属性可以有1到4个值. <style> div.outer{ width: 400p ...

  2. (转)css内边距与外边距的区别，精辟啊

    css内边距与外边距的区别 (2012-05-02 13:54:54) 转载▼ 标签: 杂谈 分类: css 本文也是网上看了后收藏的,忘了原地址(以后收藏文章得注意) 你真的了解margin吗?你知 ...

  3. CSS框模型（框模型概述、内边距、边框、外边距、外边距合并）

    CSS 框模型概述 CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边距.边框 和 外边距 的方式. 元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景. ...

  4. css内边距与外边距的区别

    你真的了解margin吗?你知道margin有什么特性吗?你知道什么是垂直外边距合并?margin在块元素.内联元素中的区别?什么时候该用 padding而不是margin?你知道负margin吗?你 ...

  5. CSS.03 -- 浏览器行高、字体；盒子模型--边框、内边距、外边距

    如果此时你也在自学中,请使用 FireWorks CS6 进行切图测距等,百度一下吧~ Fireworks的基本使用 新建文件   ctrl+n 打开文件  ctrl+o 调出和隐藏标尺 ctrl+r ...

  6. CSS -- 盒子模型之边框、内边距、外边距

    一.使用border为盒子添加边框 盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细.样式和颜色(边框三个属性). 1.border-style(边框样式)常见样式有: dashed( ...

  7. jquery获取元素的所有宽高（包括内边距和外边距）

    width() - 返回元素的宽度.height() - 返回元素的高度.innerWidth() 方法返回元素的宽度(包括内边距).                    innerHeight() ...

  8. css常用属性：居中展示、内边距、外边距

    1.横向居中.纵向居中 2.纵向展示3个块级(div标签即可纵向展示) 3.横向展示3个块级 4.在横向块级上加上边框的两种方法 法一:在父级div上加上和样式一样高的height 法二:在父级div ...

  9. css总结9：内边距（padding）和外边距（margin）

    1 css总结9:内边距和外边距 通过css总结8:盒子模型可知:内边距(padding),外边距(margin).可以影响盒子在浏览器的位置. 1.1 padding使用:{padding:上 右 ...

随机推荐

  1. WinMM.dll 函数汇总

    #include "MMSystem.h" auxGetDevCaps                  查询指定的辅助输出设备以确定其性能 auxGetNumDevs       ...

  2. spring-bean属性配置解析

    autowire属性值有 byName 根据Bean定义时的“id"属性上指定的别名与Setter名称是否一致进行自动装配 byType 根据PoJo的setXXX()方法所接受的类型判断b ...

  3. 【VxWorks系列】任务间同步与通信之信号量

    信号量是VxWorks提供的最常用,最快速的一种任务间通信机制.VxWorks中信号量有三种:二值信号量,互斥信号量,计数信号量.下面一一介绍这三种信号量的作用与区别. 信号量通常的作用就是是控制任务 ...

  4. HDU 3639 Hawk-and-Chicken(良好的沟通）

    HDU 3639 Hawk-and-Chicken 题目链接 题意:就是在一个有向图上,满足传递关系,比方a->b, b->c,那么c能够得到2的支持,问得到支持最大的是谁,而且输出这些人 ...

  5. 一 手游开发工具cocos2d-x editor初识

    可学习的demo: 7个实战项目 flappybird(飞扬小鸟).popstar(消灭星星).fruitninja(水果忍者).2048(数度消除). moonwarriors(月亮战神).frui ...

  6. pygame在安装过程中无法找到videodev.h错误

    首先参考<ubuntu 安装 pygame 非常好玩的东西>.在运行sudo python setup.py时.出现 linux/videodev.h:No such file or di ...

  7. Linux进程间通信(九)---综合实验之有名管道通信实验

    实验目的 通过编写有名管道多路通信实验,进一步掌握管道的创建.读写等操作,同时复习使用select()函数实现管道的通信. 实验内容 这里采用管道函数创建有名管道(不是在控制台下输入命令mknod), ...

  8. SVN的命令行操作

    最近在进行svn二次开发,使用的是svnkit.看了很多svnkit的api,渐渐发现都是和SVN的命令行操作对应的.顺便研究一下svn的命名行操作. 1.将文件checkout到本地目录: 基本命令 ...

  9. Android开发之按键、触摸屏和手势输入专业压力測试方法

    按键输入.触摸屏输入和手势笔画输入等功能是Android开发的基本功能.其稳定性和健壮性对移动应用系统开发很重要.按键.触摸屏和手势输入专业压力測试方法能够使用Monkey,相应用程序进行压力測试,检 ...

  10. WPF点滴

    1 设置窗体的最大化,而且无边框 <Style x:Key="WindowsStyle" TargetType="Window"> <Sett ...