CSS渡一教程学习笔记(九)--Block Format Context

问题:
父子嵌套的关系中，垂直方向的marin-top的父子元素是结合在一起的，会取父子元素中的最大值。
造成的结果就是父级元素的“棚”好像不存在一样，也即是俗称“margin塌陷”
只能弥补，不能解决。
代码:

<style>
        *{
    
            margin:0px;
            padding:0px;
        }
        .out{
    
            margin-top:100px;
            margin-left:100px;
            width:200px;
            height:200px;
            background-color: #000000;
        }
        .inner{
    
            margin-top:150px;
            margin-left: 100px;
            width:100px;
            height:100px;
            background-color:blue;
        }
</style>