小编Hub*_*Blu的帖子

我正在使用 Chakra-UI 为我的 NextJS 项目创建 UI，并且正在努力让导航栏正常工作。它和移动导航菜单一样被正确修复，但菜单位于背景 div 的前面，但英雄 div 的后面（使用带有设置 blackAlpha 的 Flex' 组件）

如何让菜单只位于前面？使用沼泽标准CSS，如果我遇到这样的问题，我只使用z-index，但它对我不起作用。任何帮助表示赞赏

主页.js

import React from 'react';
import Hero from './Hero/Hero';
import Header from './Header/Header';
import Features from './Features/Features';

const HomePage = () => {
  return (
    <>
      <Header/>
    <Hero/>
    <Features/>
    </>
  );
}

export default HomePage

我的 Header.js （已删除绒毛）

const Header = () => {

 return (
    // Header/TopNav Container
    <chakra.header
      ref={ref}
      shadow={y > height ? "sm" : undefined}
      transition="box-shadow 0.2s"
      bg={bg}
      borderTop="6px solid"
      borderTopColor="brand.400"
      w="full" …