网页上未显示humburber菜单

Question

我想做一个汉堡包菜单，然后写这段代码

<header class="header">
<nav class="flex flex-jc-sb flex-ai-c">
<a href="/" class="header__logo">
<img src="images/logo.svg" alt="easybank" />
</a>
<a href="#" class="header__menu">
<span></span>
<span></span>
<span></span>

然后这段scss中的代码

.header{

nav{
    padding: 24px;
    
}

&__logo{
    img{

    }
}
&__menu{ //humburgermenu
    > span{
        display: block;
        position: absolute;
        width: 4px;
        height: 1px;
        background-color: $darkBlue;

        &:not(:last-child){
            margin-bottom: 5px;

        }
    }

}}

当我返回网站时，humbuger菜单没有显示，当我检查它时，它显示了0x17的跨度。我该怎么办？非常感谢

Answer 1

您还没有关闭一些标签

​

.header nav {
     padding: 24px;
}
 .header__menu > span {
     display: block;
     position: absolute;
     width: 4px;
     height: 1px;
     background-color: #aaa;
}
 .header__menu > span:not(:last-child) {
     margin-bottom: 5px;
}

<header class="header">
<nav class="flex flex-jc-sb flex-ai-c">
<a href="/" class="header__logo">
<img src="images/logo.svg" alt="easybank" />
</a>
<a href="#" class="header__menu">
<span></span>
<span></span>
<span></span>
</a>
</nav>

​