边距、边距和边界框的贡献之间的差异是什么?

时间:2021-08-13 01:12:45

Here is image to explain my question better

这里有一张图片可以更好地解释我的问题。

边距、边距和边界框的贡献之间的差异是什么?

Every control has bounding box and every control has margins and padding. In the image The Gap between button border and the border of the bounding box is labeled as GAP-B, is this the padding or Margin?

每个控件都有边框和填充。在图像中,按钮边框与边框之间的间隙标记为Gap - b,这是填充还是边框?

Also there is gap between the two buttons GAP-A, is this the padding or margin?

另外两个按钮gapa之间也有间隙,这是边距还是边距?

2 个解决方案

#1


-1  

Gap A is margin where as Gab B is padding.

间隙A是边距,而Gab B是边距。

Padding is defined as the gap between the element and each border.

填充被定义为元素和每个边界之间的间隙。

Margin is defined as the gap between the border of 2 elements

边界定义为两个元素边界之间的距离。

#2


11  

Gap A is Margin and Gap B is Padding.

间隙A是边距,间隙B是填充。

Padding on second Border

填充第二个边界上

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

边距、边距和边界框的贡献之间的差异是什么?

Margin on second border

保证金在第二边界

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

边距、边距和边界框的贡献之间的差异是什么?

#1


-1  

Gap A is margin where as Gab B is padding.

间隙A是边距,而Gab B是边距。

Padding is defined as the gap between the element and each border.

填充被定义为元素和每个边界之间的间隙。

Margin is defined as the gap between the border of 2 elements

边界定义为两个元素边界之间的距离。

#2


11  

Gap A is Margin and Gap B is Padding.

间隙A是边距,间隙B是填充。

Padding on second Border

填充第二个边界上

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

边距、边距和边界框的贡献之间的差异是什么?

Margin on second border

保证金在第二边界

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

边距、边距和边界框的贡献之间的差异是什么?