当前位置: 首页 > Web前端 > CSS

前端面试CSS环节问题 top、translateY这种属性如果使用百分比,是相对于谁的百分比

时间:2023-03-31 00:09:58 CSS

前端面试CSS链接题。top和translateY属性如果用百分比表示,是相对于谁?根据其父元素的长度或宽度计算的值,如父元素:position:releative;height:100px子元素:position:absotule;高度:200px顶部:30%;那么最终的top值为30px;如果你使用transform:translateY(30%);这里的百分比是相对于元素本身的高度计算的;父元素:position:relative;height:100px子元素:position:absotule;height:200pxtransform:translateY(30%)这里transformY轴的值为60px