哦，嘿，填充百分比基于父元素的宽度

今天，我学到了一些有关基于百分比的（％）填充的知识，我脑海中完全错了！我一直认为百分比填充是基于元素本身的。因此，如果元素宽1,000像素，带有填充顶：50％，则填充为500像素。基于宽度的顶部填充是很奇怪的，但这就是它的工作原理 - 但只是有点。 50％基于父元素的宽度，而不是本身。那就是让我困惑的部分。

我唯一弄乱百分比填充的时间就是做纵横比框的技巧。该元素是流体宽度的，但是您想维持纵横比，因此是填充技巧的百分比。在这种情况下，元素的宽度是父母的宽度，因此我的错误心理模型从来没有关系。

证明这一点并不需要太多：

感谢卡梅隆·克拉克（Cameron Clark）提供的电子邮件：

当您有一个扩展的块元素以完全填充其父的宽度时，区别在于，如本文中所用的每个示例。但是，当您在100％以外的元素上设置任何宽度时，这种误解将导致令人困惑的结果。

他们指出了Aayush Arora的这篇文章，他声称只有1％的开发人员知道这一点。

以上是哦，嘿，填充百分比基于父元素的宽度的详细内容。更多信息请关注PHP中文网其他相关文章！