<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

        *{padding:0;margin:0;}

        #b{margin-top:30px;margin-left:20px;width:200px;height:200px;background:pink;}

        #a{margin-top:30px;margin-left:20px;width:100px;height:100px;background:black;}

    </style>

</head>

<body>

<div id="b">

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

</div>

</body>

</html>

却得到：问题来了：为什么子黑和父红没有上边距呢

解决：为红块设置：上下border或者上下padding，或者！设置 overflow:hidden;

　　

css2--collapse的更多相关文章

  1. web前端CSS2学习2017.6.17

    CSS---表现层,修饰和表现html文档,为了解决结构层和表现层分离的问题. 通过CSS极大的提高了工作效率,方便工作人员维护和管理CSS:层叠样式表,目前用的最广泛的css版本为css2,最新版本 ...

  2. CSS2实用知识点详解

    CSS相关知识回顾目录 CSS2选择器 假选择器的使用 属性选择器的使用 边框设置 背景设置 字体设置 文本属性 a标签假选择器使用 列表设置 表格设置 鼠标设置 单位设置 隐藏显示 位置设置 清除浮 ...

  3. 由position属性引申的关于css的进阶讨论（包含块、BFC、margin collapse）

    写这篇文章的起因是源于这篇文章:谈谈面试与面试题 中关于position的讨论,文中一开始就说的这句话: 面试的时候问个css的position属性能刷掉一半的人这是啥情况…… 其实这问题我本来打算的 ...

  4. CSS的margin塌陷（collapse）

    <!DOCTYPEHTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head&g ...

  5. web前端学习部落22群 明白何谓Margin Collapse

    明白何谓Margin Collapse 不同于其他很多属性,盒模型中垂直方向上的Margin会在相遇时发生崩塌,也就是说当某个元素的底部Margin与另一个元素的顶部Margin相邻时,只有二者中的较 ...

  6. css2 [lang|=en] 误区

    [lang|=en] w3c说明:css2选择器,选择以en开头的的lang属性. w3c的这个解释是有误区的,en开头,但是en后面必须要有-,也就是说是选择的是en-开头

  7. CSS2中基本属性的介绍

    这是继上一篇的选择器的总结,对css2基本属性的小结!

  8. CSS2样式中选择器的介绍

    这里主要是对css2中的选择器进行了一下总结!

  9. 关于由CSS2.1所提出的的BFC的理解与样例

    今天在这里谈谈css中BFC.“BFC”是Block Formatting Context的缩写,这个概念是由CSS2.1提出来的,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用.满 ...

  10. Bootstrap 折叠（Collapse）插件

    折叠(Collapse)插件可以很容易地让页面区域折叠起来.无论您用它来创建折叠导航还是内容面板,它都允许很多内容选项. 如果您想要单独引用该插件的功能,那么您需要引用 collapse.js.同时, ...

随机推荐

  1. 在ie7中overflow:hidden失效问题及解决方案

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  2. 移动web点5像素的秘密

    最近和一个朋友聊天,朋友吐露了工作上的一些不开心,说自己总是喜欢跟别人比较,活得比较累,这种感觉大部分人经历过,往往觉得是自己心态不好,其实不然,这是人性,此时应该快速摆脱这种状态,想到DOTA大9神 ...

  3. 【LeetCode】#344 Reverse String

    [Question] Write a function that takes a string as input and returns the string reversed. Example: G ...

  4. 3个sprint的团队贡献分

    第一次冲刺贡献分   成员名字 贡献分 101丘娟 23 108周诗琦 26 107杨晓霞 24 124陈程 27     第二次冲刺贡献分   成员名字 贡献分 101丘娟 23 108周诗琦 27 ...

  5. 深入剖析tomcat 笔记——第8章 载入器

    深入剖析tomcat 笔记 目录:

  6. CentOS_7.2安装Nginx_1.9

    一.安装依赖包和开发工具: yum install vim vim-enhanced wget zip unzip telnet ntsysv compat* apr* nasm* gcc gcc* ...

  7. Post提交

    以下两种Post提交方法都可行 /// <summary> /// post 数据 /// </summary> /// <param name="url&qu ...

  8. Jenkins构建时报错：No Space left on device

    Jenkins在自动化构建服务的同时也在消耗服务器的磁盘空间,如果构建的项目个数很多,而Jenkins 服务器磁盘空间又不是非常大的话,每隔一段时间磁盘空间就会爆满导致,就会出现磁盘空间不足无法构建的 ...

  9. Linux版Matlab R2015b的bug——脚本运行的陷阱（未解决）

    0 系统+软件版本 系统:CentOS 6.7 x64, 内核 2.6.32-573.el6.x86_64软件:Matlab R2015b(包括威锋网和东北大学ipv6下载的资源,都测试过) 1 脚本 ...

  10. Install Atom editor in ubuntu 14.04

    Step 1: Add repository sudo add-apt-repository ppa:webupd8team/atom Step 2: Update the repository su ...