相对于父级宽度(static、relative的元素计算时不包含父级padding,absolute、fixed的元素会加上父级的padding)的:
max-width
、min-width
、width
、left
、right
、text-indent
、padding
、margin
、grid-template-columns
、grid-auto-columns
、column-gap
等;
相对于父级高度(同上)的:
max-height
、min-height
、height
、top
、bottom
、grid-template-rows
、grid-auto-rows
、row-gap
等;
相对于自身宽高的:
border-radius
、background-size
、border-image-width
、transform: translate()
、transform-origin
、zoom
、clip-path
等;
相对于主轴长度的:
flex-basis
等;
相对于继承font-szie的:
font-size
等;
相对于自身font-szie的:
line-height
等;
相对于line-height的:
vertical-align
等;
static、relative的父级即为 实际 父级元素
如果自身设置 position: absolute
,“父级”指:相对于离它最近的那个 position
不为 static
(relative、absolute、fixed)的祖先元素,如果没有这样的元素,则相对于视口
如果自身设置 position: fixed
,“父级”指视口(父级不存在 transform
为非 none
值的情况下)。
欢迎关注、点赞