margin left为什么会位移（在网页布局中，margin-left:-300px与margin-right：-300px有什么区别请结合具体应用来说明原理）
本文目录
- 在网页布局中，margin-left:-300px与margin-right：-300px有什么区别请结合具体应用来说明原理
- css中 marage-left：-25等于marage-right：25吗
- CSS margin属性错位
- DW里DIV宽度设定固定数值,左右边距为自动为什么还是偏向一边
- css排版时出现：里面的div设置margin-top值时外面div会向下移动相应距离这是为什么 请哪位高手帮帮忙
在网页布局中，margin-left:-300px与margin-right：-300px有什么区别请结合具体应用来说明原理
这个原理很简单，这里不方便图示，只能代以文字说明：
首先要明白margin属性的作用，举个形象的例子，有两个开口盒子，一个大一个小，小盒子放在大盒子里，从正上方往下看，小盒子四条边离大盒子四条边的距离就是margin，在上述例子中margin值是正数，那么负数是什么情况呢？
负数就是说，从上面往下看，大盒子突然高度变高且开口变小（小于小盒子的开口），这就是margin值为负的概念。
附：其实这个问题很简单，如果学过物理，这与位移概念类似。
css中 marage-left：-25等于marage-right：25吗
这里有相对位移，选择参考物的原理。
此div使用position:absolute就产生了层叠关系,显示关系用z-index属性定义。他的父级需用到position:relative。因为absolute的定位是相对于父级relative的左上角为原点，如果没有则会默认以body本身为参考定位。并且用到的位移定位属性是left,right,top,bottom，而不是margin外边距。
在使用margin时要注意到几个问题：
margin-left和margin-top这两者的参考对象是以外界：
A: 如果div在盒子box内，则div的margin-left和margin-top是参考box的左边和上边，从而会相对于box做参考产生位移。
B: 如果是两div1和div2个相邻，div1在左边，div2在右边，那么div2的margin-left会参考div1的右边会产生位移；若div1在上面，div2在下面，那么div2的margin-top会参考div1的下边会产生位移。
2. margin-right和margin-bottom这两者的参考对象是以自己本身的右边和下边（或者说div本身不动，只有它的右边距和下边距从他本身边的位置开始向外延伸出来边距。）
A:如果div在盒子box内，div相对于box没有任何位移，而div只产生了逻辑上透明的右和下外边距。对box本身也没有直接影响。（但间接的，属性值你设的太大的，可能把box外的其他元素延生推开，你自己试验一下吧）。
B:如果是两个div1和div2相邻，div1在左边，div2在右边，div1的margin-right会将div2推开，从而使得div2产生位移；若div1在上面，div2在下面，那么div1的margin-top会将div2推开，从而使得div2产生位移。
这样讲解后，如果是负值，参考如下：
CSS margin属性错位
这是因为margin-bottom:5%;这个5%是以body的width作为基准来计算的（而不是你自以为的以height为基准），这样的话当浏览器窗口的宽度发生变化时，上半部分与下半部分之间的间隔就会发生变化，从而造成下半部分有时会超出父元素范围，有时又会缩进去。
改成下面这样就没问题：
margin-bottom:5vh;
但是vh是css3新增的长度单位，会带来浏览器兼容问题。
或者可以用一个空白的div，height设为5%（这个则是以body的height作为基准进行计算的，所以没问题），把它作为上下两部分的间隔，这个应该是兼容性最好的解决方案。
总之，尽量不要用margin-bottom（或margin-top）加百分数的方式来作为垂直间隔！！！
DW里DIV宽度设定固定数值,左右边距为自动为什么还是偏向一边
因为Div添加了内边距属性，Div的实际宽度=Div的初始固定值+边距值
例如Div设定为宽度为100px，添加5px的上下左右内边距，该Div的最后宽度为100+5+5=110px。
CSS padding 属性定义元素边框与元素内容之间的空白区域。
内边距数值设置相同，只需要写成：padding:10px;
padding 接受长度值或百分比值，但不允许使用负值
所以如果需要给固定Div添加内边距，想要它不撑开，就将固定值设置为想要得到的宽度值与边距值之差。
css排版时出现：里面的div设置margin-top值时外面div会向下移动相应距离这是为什么 请哪位高手帮帮忙
设置logon的padding: 1px
因为logon和log_bk垂直方向的margin合并了，如果设置了logon的padding为1px就可以避免margin合并。
更多文章：
2025年8月14日 09:45
2025年10月30日 08:30
sql语句优化面试（面试问到 数据库性能优化 怎么回答 我是Oracle数据库）
2025年7月30日 02:15
2026年4月10日 03:30
图片转换代码软件（求一款图片转网页代码的工具，就是可以把图片转换成网页广告的那种，）
2025年6月30日 23:30
desense（手机desense测试，中文是什么意思怎么测试）
2025年11月12日 03:00
如何使用ubuntu系统（win10安装ubuntu双系统怎么装）
2025年9月4日 20:00
sql数据库多少钱（access sql 等的数据库，开发工具多少钱运行平台多少钱）
2026年1月21日 20:15
php环境搭建的原理（什么是PHPWEB环境的搭建及其作用）
2026年8月23日 16:15
c语言一维数组有几个数（c语言的一维数组中至少要有几个元素）
2025年11月27日 13:30
1111101100101110转为16进制？将23456表为16进制数
2025年12月19日 18:30
2025年6月30日 14:15
2026年8月29日 05:00
指针变量为什么占4个地址（C语言中，为什么指针变量无论指向那个类型的变量，其所占的字节都为4个字节详解）
2025年7月27日 19:00
html5模板 支付成功（html5怎么实现支付宝实时转账）
2025年7月5日 15:45
2026年7月12日 02:45
js jquery面试（jquery中怎么调用js方法调用）
2025年8月8日 03:45
2026年5月11日 16:00
