开发者社区> 问答> 正文

之所以margin-left为负可以使元素向左移动是不是因为负的margin-left增大了margin-right?

margin-left: -100px;可以使元素向左移动100px,原因是不是因为margin-left+border-left+padding-left+width+padding-right+border-right+margin-right为定值,margin-left减了100使得margin-right增了100而引起了左移?
看了回答,明白不是这个原因了,那到底是什么原理使得负margin会引起移动呢?

展开
收起
a123456678 2016-03-25 13:58:20 2491 0
1 条回答
写回答
取消 提交回答
  • margin-left/margin-right/margin-top/margin-bottom的值是否影响定位,跟如下CSS属性有关系:

    writing-mode/unicode-bidi/direction
    float:left/float:right
    position: absolute/position: fixed定位 & left/top & right/bottom 属性
    text-align也会影响到行内元素的左右margin
    在以上特例之外,最常见的的文档排版方向是:

    块级元素从上到下
    行内元素从左到右
    想象一下,这个排版方向可以感性理解为盒子的堆叠方向……堆叠盒子的方向是从左向右的时候,盒子是一个一个从最左侧往右放的,基于左侧的位移(margin-left)可以生效,基于右侧的位移(margin-right)不能生效,因为要知道盒子的位置,你得看在你左边的盒子的厚度。懂了吗?

    因此,在正常情形下,margin-left是可以影响到元素的偏移量的。

    LZ对布局的理解非常诡谲……我建议LZ先完成:

    对W3school的css布局相关内容的学习
    从旧往新,读完CSS探索之旅:margin系列的文章

    2019-07-17 19:14:11
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载