以两个并排显示的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. 关于使用commons-email包测试发送邮件遇到的问题

    项目中有个需求是这样的:客户办理某一项业务,当用户成功提交业务办理信息后,系统生成一个业务随机码给用户,以此作为以后的业务办理结果查询依据.鉴于随机码较长,方便用户记录,在生成随机码的同时,提供用户发 ...

  2. MVVM Light须要注意的10个问题

    MVVM Light须要注意的10个问题 从使用XAML技术基础開始(实际上并非非常久曾经).我便关注MVVM(Model – View – ViewModel)模式.偶然接触到MVVM Light不 ...

  3. 如何解决KEIL 5 编KEIL4同RTX系统的project解决方法

    1.我个人KEIL5与KEIL4对照 相较于KEIL 5 的"华丽".笔者还是喜欢KEIL4的"内敛",主要也还是习惯了.懒得换了.由于工作的  原      ...

  4. mmap。

    linux mmap 内存映射 mmap() vs read()/write()/lseek() 通过strace统计系统调用的时候,常常能够看到mmap()与mmap2().系统调用mmap()能够 ...

  5. g++编C++11/C++0x遇到的问题

    在看<Cplusplus Concurrency In Action Practical Multithreading>当遇到第一个样品: #include<iostream> ...

  6. C编译: 使用gdb调试

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! gdb是the GNU Debugger的简称.它是一款UNIX平台的调试器(de ...

  7. TCP关闭过程

    状态迁移 . SO_LINGER/ SO_REUSEADDR TCP正常的关闭过程如下(四次握手过程): (FIN_WAIT_1) A ---FIN---> B(CLOSE_WAIT) (FIN ...

  8. 你真的了解mysql的varchar字段的长度有多少吗?

    今天在设计系统字段的时候, 发现自己对varchar还不够了解.我设了一个字段.类型为VARCHER,然后我就往里面测试性了写了东西.发现没有多少就满了.我觉得奇怪,5.5版本以上的MYSQL不是有6 ...

  9. SPOJ 375（树链剖分）

    题目连接:http://acm.hust.edu.cn/vjudge/contest/view.action?cid=28982#problem/I 题意:一棵包含N 个结点的树,每条边都有一个权值, ...

  10. HDOJ 3516 Tree Construction

    四边形优化DP Tree Construction Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/32768 K (Jav ...