以两个并排显示的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. OpenRisc-50-or1200的freeze模块分析

    引言 之前,我们分析or1200的控制通路中的sprs模块和except模块,本小节,我们就分析一下or1200控制通路的最后一个模块,就是freeze模块. 1,整体分析 freeze模块,顾名思义 ...

  2. 【编程之美】java二进制实现重建

    package com.cn.binarytree.utils; /** * @author 刘利娟 liulijuan132@gmail.com * @version 创建时间:2014年7月20日 ...

  3. 基于Grunt的版本号构建系统新手教程

    作者:zhanhailiang 日期:2014-10-12 1. 安装nodejs,npm,grunt-cli.參见<Windows环境下安装nodejs+npm+grunt-cli工具> ...

  4. (1)cocos2d-x-2.2.4搭建windows开发环境

    Cocos2d-x-2.2.4搭建windows环境 软件需求 Windows系统(windows7或之后的系统): cocos2d-x-2.2.4压缩包. python安装包(推荐使用2.7.3版本 ...

  5. zzu--2014年11月16日月潭赛 B称号

    1229: Rational Resistance Time Limit: 1 Sec  Memory Limit: 128 MB Submit: 8  Solved: 4 [id=1229" ...

  6. PPTP和L2TP的区别

    PPTP是点到点的隧道协议,服务器端使用TCP 的1723端口,同时使用GRE协议,加密上使用MPPE.位于NAT后的客户端连接会有问题. L2TP是二层隧道VPN,使用IPsec 进行加密,服务器端 ...

  7. Redis key 设计技巧

    1: 把表名转换为key前缀 如, tag: 2: 第2段放置用于区分区key的字段--对应mysql中的主键的列名,如userid 3: 第3段放置主键值,如2,3,4...., a , b ,c ...

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

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

  9. 新版SDK自己主动加入PlaceholderFragment的思考

    自从Android SDK更新到22.6.3,发现新建Activity的时候,会自己主动生成一个Fragment.这个Fragment是activity的静态内部类.同一时候生成了一个xml叫frag ...

  10. HTML中的div标签

    在网页制作过程过中,能够把一些独立的逻辑部分划分出来.放在一个<div>标签中,这个<div>标签的作用就相当于一个容器. 为了使逻辑更加清晰,我们能够为这一个独立的逻辑部分设 ...