Margin塌陷现象是否只会出现在块级元素上面？

Question

设置

    .box div{
            /*float: left;*/
            display: inline-block;
            width: 100px;
            height: 100px;
        }
    .box .son1{
            height: 230px;
            background: green;
            margin-bottom: 10px;
        }
    .box .son4{
            width: 230px;
            height: 100px;
            background: blue;
            margin-top: 20px;
        }

把div的display属性设置成inline-block之后发现没有margin塌陷现象，是否只有块级元素有塌陷现象？而行内元素没有呢？

Answer 1

你应该了解下BFC(Block Fommat Content)块级格式上下文，就能很清楚的避开这些坑。
看下这两篇文章，可以了解BFC.
谈谈BFC与ie特有属性hasLayout
CSS布局基础——BFC

Answer 2

只有普通流（normal flow）中 同一个BFC内 的块级元素的相邻的（也就是两个margin是紧挨着的，中间没有border或padding）垂直外边距才会发生外边距叠加。