用百分比布局时，子元素那些属性值取决于父元素的高那些属性取决于宽

欢迎访问我的个人博客：http://www.xiaolongwu.cn

前言

我们先想个问题，带着问题看这篇文章可能会理解的更好一点：百分比布局时，子元素竖向的属性值都是取决于父元素的高吗？

慢慢向下看

1. 取决于父元素高度的：[max/min-]height、top、bottom 等；后两者是在有position属性的前提下
2. 取决于父元素宽度的： [max/min-]width、left、right 等；同理left和right也是在有position属性的前提下；
3. 那么padding-top、margin-top…等四个方向的值取决于谁呢？

他们都是取决于父元素的宽，和父元素的高没有一点关系

俗话说的好，眼过千遍不如手过一遍，我们自己试试之后就会真真的记住了

在这里我就不写demo了，大家自己动手试一下

发散拓展部分

相对于自身宽高的border-radius、background-size、transform: translate()、transform-origin、zoom、clip-path 等；

我的个人博客：http://www.xiaolongwu.cn

如果您对我的博客内容有疑惑或质疑的地方，请在下方评论区留言，或邮件给我，共同学习进步。

邮箱：wuxiaolong802@163.com