为什么 `bottom: 0` 粘性定位的行为与 MDN 的描述不同？

当为粘性定位指定bottom: 0时，为什么它与MDN的描述不同？

position:sticky属性引入了混合行为相对定位和固定定位之间。它模仿相对位置，直到达到指定的阈值，此时它会转换到固定位置。

但是，在设置了 Bottom: 0 的代码片段中，行为似乎与实际相反MDN 的文章中有描述。该元素一开始是固定的，滚动超过阈值后会转变为相对。

这种差异背后的原因在于 MDN 定义的措辞：

“粘性定位可以被认为是一种混合”相对和固定定位的元素被视为相对定位，直到它超过指定的阈值，此时它被视为固定，直到它到达其边界。父母。”

这里的关键词是“直到超过指定的阈值。”在您的代码中，当页面最初呈现时，元素已经超过了指定的阈值（视口的底部）。因此，它立即进入固定定位状态，尽管bottom: 0表示阈值应该从relative过渡到fixed。

综上所述，当为粘性元素指定bottom: 0时，它首先开始fixed因为已经达到阈值，然后当元素向上滚动超过视口底部时，它会转换为相对。此行为与 MDN 定义一致，但使用的语言可能有些令人困惑。

以上是为什么 `bottom: 0` 粘性定位的行为与 MDN 的描述不同？的详细内容。更多信息请关注PHP中文网其他相关文章！