css样式的百分比相对于谁

1.相对于父级宽度的：

max-width、min-width、width、left、right、text-indent、padding、margin、grid-template-columns、grid-auto-columns、column-gap 等；

  元素宽高比保持16：9例如video，可通过padding实现
 .video-box{
    width:100% //宽度为父元素宽度
    padding-top:56.25%； //可以使的高度为父元素宽度的56.25%，从而使盒子比例始终保持16：9
  }

2.相对于父级高度的：

max-height、min-height、height、top、bottom、grid-template-rows、grid-auto-rows、row-gap 等；

3.相对于主轴长度的：

flex-basis ；

4.相对于继承字号的：

font-size ；

5.相对于自身字号的：

line-height ；

6.相对于自身宽高的：

border-radius、background-size、border-image-width、transform: translate()、transform-origin、zoom、clip-path 等；

7.相对于行高的：

vertical-align ；

8.特殊算法的：

background-position （方向长度 / 该方向除背景图之外部分总长度）、border-image-slice （相对于图片尺寸）、filter 系列函数等；

如果自身设置 position: absolute，“父级”指：Boring：破坏文档流的div高度设为百分比是相对谁而言的？；
如果 position: fixed，“父级”指视口（父级不存在 transform 为非 none 值的情况下）。