边距和填充有什么区别和边界框的贡献？

Question

这是更好地解释我的问题的图片

每个控件都有边界框，每个控件都有边距和填充。在图像中按钮边框和边界框边框之间的间隙标记为GAP-B，这是填充还是边距？

两个按钮GAP-A之间也有间隙，这是填充还是边距？

Answer 1

差距A是保证金，差距B是填充。

  

填充第二个边框

 <StackPanel>
    <Border  Height="100" Width="400" >
        <Button  Content="StackOverFlow" Background="Yellow"/>
    </Border>
    <Border Padding="20" Background="Lime"  Height="100" Width="400">
        <Button  Content="StackOverFlow" Background="Yellow"/>
    </Border>
</StackPanel>

  

第二个边界的保证金

    <StackPanel>
    <Border  Height="100" Width="400" >
        <Button  Content="StackOverFlow" Background="Yellow"/>
    </Border>
    <Border Margin="20" Background="Lime"  Height="100" Width="400">
        <Button  Content="StackOverFlow" Background="Yellow"/>
    </Border>
</StackPanel>

Answer 2

Gap A是填充，其中Gab B是Margin。

保证金定义为元素与每个边界之间的差距。

填充定义为2个元素边界之间的间隙