在CSS中,边距和填充到底有什么区别?它似乎真的没有多大用处。你能给我举个例子说明区别在哪里(以及为什么知道区别很重要)吗?
当前回答
边距和填充之间的一个关键区别在任何答案中都没有提到:点击性和悬停检测
增加填充会增加元素的有效大小。有时我有一个很小的图标,我不想让它看起来更大,但用户仍然需要与该图标进行交互。我增加了图标的填充,让点击和悬停的足迹更大。增加图标的边距不会有同样的效果。
关于这个主题的另一个问题的回答给出了一个例子。
其他回答
试着在一个有宽有高的div块上添加一个背景色。您将看到填充增加了元素的大小,而边距只是在文档流中移动元素。
边距是专门用来移动元素的。
有一个重要的区别:
边距——位于元素的外部,即在元素开始后应用空格移位。 Padding-在内部,另一个将在元素开始之前应用空白。
填充是在内容和边框之间计算的。 保证金是在边界外计算的。
你可以看看这个链接,在那里你可以看到在CSS中padding和margin是如何工作的。 https://raw.githack.com/sushantbramhacharya/WebTechnology_LEC/main/margin/index.html
基本上,边距和边距的区别在于背景。填充将决定内容之间的空间,而边距将决定元素的外部边缘!