html - 左边距和左边距之间的区别

This question already has answers here:

Difference between margin and padding?
                                
                                    （20个答案）
                                
                        
                                2年前关闭。
            
                    
我想知道为什么这些选择器会产生相同的结果

#position2{
    	margin-left:25px;
    }

#position3{
    	padding-left:25px;
    }

<h1 id="position2">Stackoverflow</h1>
<h1 id="position3">Stackoverflow</h1>

 谁能解释这两个属性之间的主要区别

最佳答案

当然！

因此，将margin添加到目标元素的外部-在这种情况下，它被放置在#position2 div外部的左侧。

另一方面，padding被添加到目标元素内。最简单的方法是在您已有的代码中添加背景色：

#position2{
        margin-left:25px;
        background-color: blue;
    }

#position3{
        padding-left:25px;
        background-color: red;
    }

然后输出以下内容，以清晰的视觉方式显示正在发生的事情：