1.使用百分比的属性：width,heightmargin,paddingtop,right,bottom,lefttransform-translatebackground-position,background-size2。containingblock2.1为什么需要知道containingblockMDN：一个元素的大小和位置通常会受到它的包含块的影响。大多数情况下，包含块是元素最近的块级祖先的内容区域，但情况并非总是如此。在本文中，我们研究了决定元素包含块的因素。所以百分比是相对的2.2containingblock的定义是根据它的containingblock计算的翻译自MDN：containingblock的定义与元素的position属性有关：static或relative：最近的__blockcontainer__（如inline-block,block,list-item)或__formattingcontext__的祖先元素的__contextbox__absolute（例如tablecontainer，flexcontainer，gridcontainer或blockcontainer）：最近的位置属性不是静态的__paddingbox__fixed：窗口特例，当fixedorabsolute，当父元素有如下条件时，包含块为父元素的__paddingbox__：1).transform或perspective属性的值不是none2)。will-change属性的值为transform或persp有效3).filter属性不为none或者will-change属性的值为filter（只在Firefox下有效）3.如何根据其包含块的高度计算高度、顶部、底部，如果不指定高度（根据adapt中的内容），那么计算的值为0width，left，right，padding，margin根据其包含块的宽度计算。transform-translate,translateX,translateY,是根据__self元素__背景的实际宽度计算的：4.1background-position是根据__self元素（不包含块）__的宽高计算的4.2background-size是根据计算的到图像的大小。需要注意的是，当使用单个百分比（如background-size:50%;）来计算时，高度会被隐式设置为auto，当其高度计算出的值大于容器的高度时，多余的部分将被隐藏。如果需要全部显示，需要显式设置宽高值（比如background-size:50%50%;）
