CSS：为什么我的HTML元素是相对定位的？

通过相对定位，我的意思是当高度方面时，当我尝试添加标题时，下面的其他元素将被“向下推”

document.querySelector（“.toggler”）.addEventListener（“单击”，函数（事件）{
this.parentElement.classList.toggle（“向上”）；
});
*{
保证金：0；
填充：0；
}
html，正文{
身高：100%；
宽度：100%；
}
.盒子{
身高：100%；
寡妇：100%；
背景图像：url（'http://tombricker.smugmug.com/Travel/San-Francisco-California/i-jk2Z7D7/0/L/san-francisco-golden-gate-bridge-morning-sun-bricker-L.jpg');
背景尺寸：封面；
背景位置：中心；
溢出：隐藏；
}
.幻灯片{
背景：红色；
高度：77vh；
宽度：55vw；
位置：相对位置；
左：38vw；
变换：translateY（100vh）；
转换：转换0.4s缓解；
}
.扳机{
/*三角按钮*/
位置：绝对位置；
顶部：-3vh；
宽度：0px；
高度：0px；
左边框：27.5vw实心透明；
右边框：27.5vw实心透明；
边框底部：3vh纯白；
}
/*请参阅JS，了解是否使用了“up”*/
.向上滑{
转换：translateY（23vh）；
}
.滑动.向上.切换器{
变换：translateY（3vh）rotateX（180度）；
}
位置：相对位置
不同于
位置：绝对
：它仍然保持文档流中的元素
relative
只是意味着可以使用
top
或
left
等参数将其从默认位置移走（与使用“static”时相同）。但它仍然在文档流中，当您将内容添加到它上面的容器时，它会被移动

如果您想要一个不这样做的元素，请使用
this中的
this
中的
this
。使用
event.target.parentElement
，因为
this
在全局上下文（即触发DOM事件的上下文）中是全局上下文（即
window
），很多时候，只要使用
console.log（this），就可以更清楚地理解JavaScript的怪异之处（稍微）
。即使没有JS，问题仍然存在。您是指.slide的相对位置吗？我把它改成绝对的。但是红色的长方形还是被压了下来。