margin-left:-100px;可以使元素向左移动100px,原因是不是因为margin-left+border-left+padding-left+width+padding-right+border-right+margin-right为定值,margin-left减了100使得margin-right增了100而引起了左移?看了回答,明白不是这个原因了,那到底是什么原理使得负margin会引起移动呢?
2 回答
蝴蝶不菲
TA贡献1810条经验 获得超4个赞
margin-left/margin-right/margin-top/margin-bottom的值是否影响定位,跟如下CSS属性有关系:writing-mode/unicode-bidi/directionfloat:left/float:rightposition:absolute/position:fixed定位&left/top&right/bottom属性text-align也会影响到行内元素的左右margin在以上特例之外,最常见的的文档排版方向是:块级元素从上到下行内元素从左到右想象一下,这个排版方向可以感性理解为盒子的堆叠方向……堆叠盒子的方向是从左向右的时候,盒子是一个一个从最左侧往右放的,基于左侧的位移(margin-left)可以生效,基于右侧的位移(margin-right)不能生效,因为要知道盒子的位置,你得看在你左边的盒子的厚度。懂了吗?因此,在正常情形下,margin-left是可以影响到元素的偏移量的。LZ对布局的理解非常诡谲……我建议LZ先完成:对W3school的css布局相关内容的学习从旧往新,读完CSS探索之旅:margin系列的文章
手掌心
TA贡献1942条经验 获得超3个赞
不不不,不是这么做的,这只不过是影响了盒模型的一边而已,和右边没关系的用firebug等能够高亮显示盒模型的工具,自己调一下属性能有很明确的理解负margin引起移动是因为这个东西的对齐是以左方向为基准的。如果你对一个float:right;width:100px;的盒子去修改margin-left,我看一般都不会发生什么移动的效果。
添加回答
举报
0/150
提交
取消