<!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. iOS自定义转场动画的实现

    iOS中熟悉的是导航栏中的push和pop这两种动画效果,在这里我们可以自己实现自己想要的一些转场动画 下面是我自己创建转场动画的过程 1.新建一个文件继承自NSObject ,遵循协议UIViewC ...

  2. epoll详解

    转自:http://blog.chinaunix.net/uid-24517549-id-4051156.html 什么是epoll epoll是什么?按照man手册的说法:是为处理大批量句柄而作了改 ...

  3. 五笔拼音反查精灵 v6.69 绿色版

    软件名称:五笔拼音反查精灵 v6.69 绿色版软件语言: 简体中文授权方式: 免费软件应用平台: Win7 / Vista / Win2003 / WinXP / Win2008 软件大小: 197K ...

  4. List<string> to List<decimal> by C# 2.0

    List<" } ); List<decimal> temp = data.ConvertAll<decimal>(delegate(string x) { r ...

  5. SVN通过域名连不上服务器地址(svn: E175002: OPTIONS request failed on '/svn/yx-SVN-Server' Connection refused: connect)

    用域名直连就连不上,如果换成了ip直连就可以连接上去了 https://yx-server01/svn/yx-SVN-Server 换为了 https://192.168.188.208/svn/yx ...

  6. Objective-C和Swift实现单例的几种方式

    在Swift开发中,我们对于跨类调用的变量常量,因为并没有OC中使用的全局头文件中写宏的形式,我们一般采用在类外定义全局变量/常量的形式来跨类调用.而问题在于目前写的项目需要在新添加的OC写的功能模块 ...

  7. Python基础篇-day2

    主要内容: for循环 while循环 格式化输出(2) 数据统计及记录 ############################################################# 1 ...

  8. 解决ie阴影的兼容性

    box-shadow:0px 0px 10px #aba25b; -webkit-box-shadow:0px 0px 10px #aba25b; -moz-box-shadow:0px 0px 10 ...

  9. android 属性动画

    一直再追郭霖的博客和imooc上的一些新的视频,最近有讲到属性动画. 以下内容为博客学习以及imooc上视频资料的学习笔记: 在3.0之前比较常见的动画为tween动画和frame动画: tween动 ...

  10. android抓日志

    1. adb logcat -c 清楚以前的日志 adb logcat -s 过滤 adb logcat -s *:E adb logcat -v 指定输出的格式 adb logcat -v brie ...