LOSER学习前端的第六天

 水平方向

  margin-left border-left padding-left width padding-right border-right  margin-right

 浏览器规定  水平方向的七个值相加必须要等于父元素内容区的宽度

 0  5px  50px  100px  50px  5px  0    ==500   ?

 像以上这种，如果不等于的话，浏览器它就会自己去调整这7个值，让我们的等式成立，这个过程叫过度约束

浏览器如何调整的？

1、如果7个值中没有设置auto，那浏览器就会调整margin-right

 0  5px  50px  100px  50px  5px  290px    ==500

2、7个值中有3个值可以设置auto   margin-left    width   margin-right

   1个auto,其他两个值为固定值

      浏览器就会调整这个auto  

   2个auto，其他1个值为固定值

     margin-left  width      调整width

     width  margin-right     调整width

     margin-left  margin-right   同时margin-left margin-right，各占一半  

   3个auto

      margin-left  width  margin-right   调整width