Html 空白区起始和空白区顶部之间有什么区别？

试图理解两者在使用上的核心区别，但我没有找到一篇文章或文档详细描述这种比较。以提供的示例为例，假设如下：

div{
背景颜色：黄色；
宽度：120px；
高度：120px；
}
.示例文本{
书写方式：垂直lr；
边距块启动：20px；
背景色：#c8c800；
}

示例文本

从官方网站1，您可以阅读：

这些属性对应于页边距顶部、页边距底部、页边距左侧和页边距右侧属性。映射取决于元素的书写模式、方向和文本方向

默认情况下，您将具有以下映射：

margin-block-start = margin-top
margin-block-end = margin-bottom
margin-inline-start = margin-left
margin-inline-end = margin-right

例如：

.margin{
边缘顶部：50px；
边缘底部：10px；
左边距：100px；
右边距：200px；
}
.页边距高度{
边距块启动：50px；
边缘块端：10px；
边距内联开始：100px；
边距内联端：200px；
}
div{
边框：2倍实心；
填充：20px；
}

A.

A.

指包含块的宽度。这仅适用于使用百分比作为边距值的情况。值的百分比几乎总是使用父块的宽度计算的。因此，如果您的

边距顶部
为
10%
，并且您增加了包含块的宽度，那么相对于包含块的计算宽度，它将为
10%
。