我想在部分下方显示页脚

Question

我的前端导师提出了一个挑战，我想在 cta-card 部分下方制作页脚 正如你在屏幕上看到的那样

但即使我更改 z-index 也完全不会影响它。

这里是 link 项目页面：https://cheerfuldev1.github.io/HuddleLandingPage/

这里还有 link 到 github 中的回购：https://github.com/CheerFulDev1/HuddleLandingPage

Answer 1

您可以从css技巧中参考这个short article。 z-index 不起作用的最常见用例是一个或多个元素未将 position 属性 设置为 absolute 或 relative

z-index only affects elements that have a position value other than static (the default).

z-index 不用担心，z-index 似乎并没有在示例页面上实际使用，您可以通过检查呈现的页脚 html 来发现这一点。

Answer 2

为了扩展@Scott Anderson 的回答，

他是对的，你需要设置 position 属性 试试下面的 css

.cta-card {
    position: relative;
    z-index: 1;
}

.cta-card .card {
    background-color: white;
}

第一个块是使用 z-index 并在其后面显示页脚。

第二个块是让卡片有白色背景，因为它在你的例子中没有