html - Top & Left vs margin-top 和 margin-left

标签 html css layout

使用 top 和 left 属性以及 top 和 left margin 有什么区别?

我知道 top 和 left 通常用于 position:absolute 情况,但我仍然想知道是否有任何重大区别。

例如:

position:absolute;
top:5px;
left:5px;

-对比-

margin-top:5px;
margin-left:5px;

最佳答案

好吧,主要区别在于绝对定位元素被从内容流中拉出。

但是对于相对定位的元素,周围的内容可能会变得模糊不清。

另一方面,边距会添加到元素的大小,而周围的内容会相应地流动。

参见 this sample fiddle有一些差异。

当然也有两种方法得出相同结果的情况,但在正常情况下,这两种方法不能简单地交换或比较。

关于html - Top & Left vs margin-top 和 margin-left,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6419411/

相关文章:

html - Css 布局,表与否

javascript - 为什么 bootstrap 4 slider 工作不顺畅?

javascript - 在 Action url php 中传递变量值

html - 悬停背景图像消失在文本后面

Android GridLayout 等列宽

java - ConstraintLayout垂直链权重

algorithm - UI布局问题/算法

javascript - 无法让我的 js 在我的 Bootstrap 导航栏中工作

javascript - jquery动画将一个类移动到一个div中

jquery - 缩放和平移 SVG 的插件