css盒子使用margin修改外边距出现嵌套块元素垂直页边距的塌陷问题及其解决方法。

1.在平时的操作过程中我们经常会使用两个盒子的嵌套问题，今天带大家来分析一下盒子嵌套问题的分析和三种解决方法.                                                                                                                    2.首先我们在vscode中写入两个盒子box1和box2，其中box1:width: 300px;height: 300px :background-color: pink;                                                                box2:width: 200px;height: 200px; background-color: green;

代码实现效果如下图：

         

执行程序后，我们会发现有两个嵌套在一起的盒子，box1为粉红色，box2为绿色。如图所示： 

                                           

这个时候，假设我们想让这个绿色盒子向下移动50px，在这里我们使用margin外边距进行操作   

输入代码：margin-top:50px；后我们发现，绿色盒子并没有进行移动，而是整个盒子一和盒子二的整体向下移动了50px，这个时