gpt4 book ai didi

html - 具有 z-index 的元素不会隐藏具有较低 z-index 的元素

转载 作者:行者123 更新时间:2023-12-02 00:49:20 26 4
gpt4 key购买 nike

这种 z-index 格式应该如何工作?我应该只能看到带有 z-index150 的层,而不是任何其他层,但我能够看到所有三个层,因为 z-indez 不工作。它应该如何工作?

<!DOCTYPE html>
<html>
<head>

<meta charset="UTF-8">
<title>z-index</title>
<!--Problem is that the z-index is not at all working-->

</head>
<body >
<!--first div is with highest z-index, it should be on the top layer of the screen-->
<div style=" background-color: #000000 ;height:1000px;width:1000px;z-index:150">
<!--second div is with 100 z-index, it should be on the middle layer of the screen-->
<div style=" background-color: #d0d4db;height:500px;width:500px;z-index:100;">

<!--third div is with 50 z-index, it should be on the lowest layer of the screen-->
<div style=" background-color: #990a0a;height:100px;width:100px;z-index:50;">
</div>
</div>
</div>
</body>
</html>

最佳答案

z-index 属性指定元素的堆叠顺序。具有较高堆栈顺序的元素始终位于具有较低堆栈顺序的元素之前。

注意:z-index 仅适用于定位元素(position:absolute、position:relative 或 position:fixed)。

我想你还需要引用这个链接

https://css-tricks.com/almanac/properties/z/z-index/

关于html - 具有 z-index 的元素不会隐藏具有较低 z-index 的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41196003/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com