margin-left:auto以及一些包含块的认知

今天在学习使用grid布局的过程中偶然发现margin-left居然可以让盒子靠右，然后开始查资料，w3c解释是这样的

常规流中的块级非置换元素需要满足： 'margin-left' + 'border-left-width' + padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' = 包含塊的寬度

若恰好只有一個值被指定為 'auto'，則該使用值由等式求出

第一个信息：必须时块级元素才具备这样，既然是w3c规定，那么就很好的解释了为什么块级元素可以独占一行了：                                              margin,padding默认是0，width又是定宽，margin-left设置为auto，自然会让盒子右移，来充满整个包含块。

第二个信息：非置换元素，指的是那些标签中可以直接展示给用户信息的，例如span，p等，置换元素就类似于input，button。

第三个信息：包含块的概念，通俗意义上就是相当于她的父元素，当然是在没有设置定位的情况下，如果设置过定位的话要以最近                        的设置过定位的父元素来充当包含块。