哦，嘿，填充百分比基於父元素的寬度

今天，我學到了一些有關基於百分比的（％）填充的知識，我腦海中完全錯了！我一直認為百分比填充是基於元素本身的。因此，如果元素寬1,000像素，帶有填充頂：50％，則填充為500像素。基於寬度的頂部填充是很奇怪的，但這就是它的工作原理 - 但只是有點。 50％基於父元素的寬度，而不是本身。那就是讓我困惑的部分。

我唯一弄亂百分比填充的時間就是做縱橫比框的技巧。該元素是流體寬度的，但是您想維持縱橫比，因此是填充技巧的百分比。在這種情況下，元素的寬度是父母的寬度，因此我的錯誤心理模型從來沒有關係。

證明這一點並不需要太多：

感謝卡梅隆·克拉克（Cameron Clark）提供的電子郵件：

當您有一個擴展的塊元素以完全填充其父的寬度時，區別在於，如本文中所用的每個示例。但是，當您在100％以外的元素上設置任何寬度時，這種誤解將導致令人困惑的結果。

他們指出了Aayush Arora的這篇文章，他聲稱只有1％的開發人員知道這一點。

以上是哦，嘿，填充百分比基於父元素的寬度的詳細內容。更多資訊請關注PHP中文網其他相關文章！