先看代码:
执行结果如下图:
内盒margin-top设为30px;
margin-left设为30px;
可以看到左外边距有效而顶外边距使外盒向下移动了30px;
1.margin-left:
外盒没有向右移动是受文本流的影响
2.margin-top:
外盒受影响向下移动是因为外盒没有内边距丶边框,其仍然以浏览器为参考线。给外盒设置边框border丶内边距可以解决,也可以设置浮动和(overflow:hidden)溢出隐藏解决。
盒子嵌套盒子,内部盒子margin-top失效而margin-left有效详解
最新推荐文章于 2023-07-31 15:56:49 发布