👨🏻‍💻 如何在 1 分钟内解决 Z-index 问题😲😲

欢迎开发人员阅读我的博客文章，这篇文章对前端开发人员更有益，因为这个工具可以与前端内容一起使用，但是了解您的前端开发人员朋友正在使用什么工具总是有帮助的。

所以，我亲爱的前端开发人员朋友，我知道您在 HTML 和 CSS 的帮助下设计出了很棒的网站，并在 javascript 的帮助下使它们具有交互性。但事情并不总是如我们所愿。

我将分享 chrome dev 工具中的一个工具，您可以在调试 Z-index 的下一个问题时使用它。

Z 索引：

Z-Index 是 CSS 的一个重要属性。它指定元素及其后代元素的堆叠顺序。我们将 Z-index 与绝对位置或相对位置一起使用。当元素重叠时，Z-order 决定哪个元素覆盖另一个元素。

在进行任何设计时，您都必须使用这个属性，有时您想要显示在顶部的 Div 不会显示，无论您为其指定 1000000 的 Z-Index。

不要一直尝试给出随机数。使用以下工具检查你的 div 元素的位置。你在做这件事时一定会感到沮丧

保持冷静，
1）打开 Chrome Dev 工具
2）点击右侧的三个点，打开更多工具并选择图层， 现在您将看到以下屏幕

控制台文本下有三个可用选项，

1）第一种模式是平移模式，用于将给定窗口拖到图层窗口内

2）第二种模式是旋转模式，您可以使用此模式旋转窗口并查看元素的定位方式，

3）第三个用于重置第一和第二个设置。

如果你正在用笔记本电脑或 PC 阅读这篇文章，请打开 DevTool 尝试一下。你可以看到元素在任何网站上的定位。还有两个选项可以尝试一下。

下周我将发布一篇新文章，其中包含有关 chrome dev tools 的所有秘密提示和技巧。如果您希望在发布时收到通知，请关注我。

感谢您的阅读❤，如果您想阅读更多类似的内容，请关注我，谢谢

如果你在推特上，可以关注我吗？我也会在那里发布这类内容。=>关注 @kushal_js