margin-left: -100px;可以使元素向左移动100px,原因是不是因为margin-left+border-left+padding-left+width+padding-right+border-right+margin-right为定值,margin-left减了100使得margin-right增了100而引起了左移?
看了回答,明白不是这个原因了,那到底是什么原理使得负margin会引起移动呢?
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。
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系列的文章