边距和填充之间的差异和边界框的贡献是什么？

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

间隙 A 是填充，而间隙 B 是边距。

边距定义为元素与每个边框之间的间隙。

填充定义为两个元素边框之间的间隙