Como faço para dentro do Menu acionar a mudança para ativo enquanto o mouse estiver sobre o item ? Exemplo: Eu passo o mouse sobre o campo "Inicio" e só assim ele ficaria branco ?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Como faço para dentro do Menu acionar a mudança para ativo enquanto o mouse estiver sobre o item ? Exemplo: Eu passo o mouse sobre o campo "Inicio" e só assim ele ficaria branco ?
Oi Pedro, tudo bem?
Para você fazer essa mudança terá que usar a pseudo-classe do css chamada :active.
Por exemplo:HTML
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1> Mouse ativo exemplo</h1>
<p> O link de "Menu" ficará verde limão quando você clicar nele
<a href="#">Menu</a></p>
</body>
</html>E o CSS:
body {
color: #FFFFFF;
background-color: #0f0f0f;
}
p {
color :aliceblue;
}
p a:hover {
font-weight: bold;
}
p a:active {
color: lime
}Quando você deixa seu mouse pressionado a cor do Menu fica com a cor verde limão. E você pode estilizar como quiser, muito legal né?
Deixo aqui uma documentação se você quiser ler mais sobre essa pseudo-classe.
Qualquer dúvida pode chamar.
Abraços e bons estudos!