<!doctype html>

 <html>

 <head>

 <meta charset="utf-8">

 <title>无标题文档</title>

 <style>

 #box{ background:red;}

 #div{width:200px;height:200px;background:blue;margin:100px;}

 #footer{height:50px;background:yellow;}

 /*

     margin传递，子元素的上下margin会传递给父级

 */

 </style>

 </head>

 <body>

 <div id="box">

     <div id="div"></div>

 </div>

 <div id="footer"></div>

 </body>

 </html>

margin传递，子元素的上下margin会传递给父级的更多相关文章

  1. 解决子元素用css float浮动后父级元素高度自适应高度

    1.在最后一个子元素后面清除浮动 2.父元素加over-flow:hidden;(副作用:子元素定位不能超出父元素的范围) 3.父元素也一样浮动(最笨的方法): 4.子元素使用inline-block ...

  2. CSS-position 属性&元素脱离文档流引发父级边框塌陷问题

    CSS-position 属性 CSS 定位机制 CSS 有三种基本的定位机制:普通流.浮动(float)和绝对定位(position). 除非专门指定,否则所有框都在普通流中定位.也就是说,普通流中 ...

  3. 行内元素的上下margin 和 img元素的上下margin

    行内元素的特点有: 1.与其他元素在同一行 2.宽度(width).高度(height).内边距的top/bottom(padding-top/padding-bottom)和外边距的top/bott ...

  4. 【转载】设置event.cancelBubble，使触发子元素的onclick不同时触发父元素的onclick

    由于HTML中的对象都是层次结构,比如一个Table包含了多个TR,一个TR包含了多个TD Bubble就是一个事件可以从子节点向父节点传递,比如鼠标点击了一个TD,当前的event.srcEleme ...

  5. CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  6. css子元素的margin-top为何会影响父元素

    详细内容请点击 这个问题困惑了很久,虽然没有大碍早就摸出来怎么搞定它,但始终不明白原因出在哪里,如果只是IE有问题我也不会太在意,可问题是所有上等浏览器都表现如此,这样叫我怎能安心?今天总算下狠心查出 ...

  7. 子元素应该margin-top为何会影响父元素【转】

    这个问题困惑了很久,虽然没有大碍早就摸出来怎么搞定它,但始终不明白原因出在哪里,如果只是IE有问题我也不会太在意,可问题是所有上等浏览器都表现如此,这样叫我怎能安心?今天总算下狠心查出来怎么回事,居然 ...

  8. 为什么子元素设置margin-top会作用在父元素上？

    原因在于:CSS 外边距合并 复现: <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  9. 解决子元素设置margin-top，效果到父元素上的问题

    有时当我们设置子元素的margin-top,但是却发现子元素没有出现上外边距的效果,反而是父元素出现了上外边距的效果. 这种问题的解决方法如下: 1.给父元素加边框. 2.给父元素设置padding- ...

随机推荐

  1. Excel教程(11) - 查找和引用函数

    ADDRESS 用途:以文字形式返回对工作簿中某一单元格的引用.    语法: sheADDRESS(row_num,column_num,abs_num,a1,et_text) 参数:Row_num ...

  2. HDU 1863 Kruskal求最小生成树

    好久没写博客了写着玩的…… Kruskal这种东西离散都学过…… 一句话…… 添加当前图权值最小且构不成环的一条边 直到连接所有点…… 其他人好多Kruskal的模版 肯定有比我的好的…… 就是刷一波 ...

  3. vc中主线程等待子线程退出的方法

    VC线程同步,在子线程中等待另一子线程结束,通过WaitForSingleObject可以实现,但是如果在主线程中等待子线程结束,这个函数是无法完成要求的,因为它会造成主线程挂起,导致程序死掉.我们可 ...

  4. SharePoint2013基于Form(FBA)的AD认证登陆

    来源于:http://www.haogongju.net/art/1964313 1. 使用SharePoint2013实现基于AD的Form认证,首先创建一个Web Application,步骤如下 ...

  5. WimTool(Wim映像处理工具) V1.30.2011.501 免费绿色版

    软件名称: WimTool(Wim映像处理工具) V1.30.2011.501 免费绿色版软件语言: 简体中文授权方式: 免费软件运行环境: Win7 / Vista / Win2003 / WinX ...

  6. C#代码实现把网页文件保存为mht文件

    MHT叫“web单一文件”.顾名思义,就是把网页中包含得图片,CSS文件以及HTML文件全部放到一个MHT文件里面.而且浏览器可以直接读取得. 由于项目需要,需实现把指定的网页文件保存为mht文件.于 ...

  7. Python中pip安装问题解决

    用国内镜像通过pip安装python的一些包,有时会出现安装失败, 为什么总是失败?自己操作老标准了,这么简单的几个小步骤还老是出错,不由得让我怀疑是否是撞墙了,可是又懒得买vpn去翻~~一墙,无法代 ...

  8. php 项目简单分类

    项目分为:客户需求和自行研发. 商城项目:------------------------商城分类:单商家:商家就是网站所有者.如京东.凡客.          多商家:如淘宝 网站所有者不是卖家.  ...

  9. Java编译成功，用java 运行class时出现错误解决方法

    java -classpath class file's address; filename

  10. H5之重力感应篇

    手机的重力感应支持里,有两个主要的事件: 1. OrientationChange (在屏幕发生翻转的时候触发) 2. DeviceOrientation+DeviceMotion(重力感应与陀螺仪) ...