Gente, eu acho que eu coloquei as coisas em arquivos errados, vou passar o código.
cabeçalho__menu-hamgurger{
width: 24px;
height: 24px;
background-repeat: no-repeat;
background-position: center;
background-image: url(::/img/menu.svg);
display: inline-block;
--azul_degrade:#002F52;}
.cabeçalho{ background-color: var(--banco); display:flex; justify-content: space-between; align-items: center; position: relative; }
.conteiner{ display: flex; align-items: center;
.conteiner__imagem{
padding: 1em;
}
.lista-menu{
display: none;
position: absolute;
top: 100%;
}
.container__botao:checked~.lista-menu{
display: block;
}.lista-menu__titulo,.lista-menu_item{ padding: 1em; background-color: var(--banco); }
.lista-menu__titulo{ color:var(--laranja); } .lista-menu__link{
#002F52;}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AluraBooks</title>
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="reset.css">
</head>
<body>
<header class="cabeçalho"></header>
<div class="container">
<input type="checkbox" id="menu"class="container__botao">
<label for="menu">
<span class="cabeçalho__menu-hamgurger" container__imagem></span>
</label>
<ul class="lista-menu"></ul>
<li class="lista-menu__titulo">categorias</li>
<li class="lista-menu__item"><a href="#"class="lista-menu__link">progamaçao</a></li>
<li class="lista-menu__item"><a href="#"class="lista-menu__link">front-end</a></li>
<li class="lista-menu__item"><a href="#"class="lista-menu__link">infraestrutura</a>
<li class="lista-menu__item"><a href="#"class="lista-menu__link">busines</a>
</li>
<li class="lista-menu__item"><a href="#"class="lista-menu__link">Designer & UX</a></li>
</li>
</div>
<div class="container">
<img src="img/logo.svg" alt="logo da AluraBooks" class=" container__imagem>">
<a href="#"><img src="img/favorito.svg" alt="meus favoritos" class=" container__imagem>"></a>
<a href="#"><img src="img/Sacola.svg" alt="carrinho de compra" <class=" container__imagem>">/a>
</div>
<a href="#"><img src="img/usuarios.svg" alt=" meu perfil"class=" container__imagem>"></a>
</body>
</html>
`import url('.styles/header.css');
:root { --cor-de-fundo: #EBECEE; --banco:#fff; --laranja:#eb9b00; --azul_degrade:var(--azul_degrade)
}
body{ background-color: var(--cor-de-fundo); }
`
Estou perdido.
Da onde devo recomeçar as aulas?
Obrigado. Re?
