Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
gostaria q alguem me ajudasse a deixar meu menu ativo ao clicar no link, que o hover permanece em cada click, ficasse selecionado indicando qual pagina esta.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>Cantora Gospel</title>
<meta name="">
<meta name="decription" content="">
<link rel="stylesheet" href="css/estilo.css">
</head>
<body id="home">
<header>
<img src="imagens/img.png">
</header>
<div class="container">
<nav id="menu">
<ul id="nav">
<li><a href="index.html">Home</a></li>
<li><a href="news.html">News</a></li>
<li><a href="perfil.html">Perfil</a></li>
<li><a href="fotos.html">Fotos</a></li>
<li><a href="videos.html">Videos</a></li>
<li><a href="discografia.html">Discografia</a></li>
</ul>
</nav>
<section>Conteudo</section>
<aside>Relacionado</aside>
<footer>Roda Pé</footer>
</div>
</body>
</html>meu codigo css.
*{
margin: 0px;
padding:0px;
font-family: arial;
}img{
width:100%;
margin:-36px;
}nav#menu ul{
list-style:none;
position: relative;
top: -10px;
left: 30%;
}nav#menu li{
display:inline-block;
padding:10px;
}color: #fff;
text-decoration:none;
padding:10px;
}color:#000;
}li:hover{
background:#fff;
}header{
background-color:#fff;
width:100%;
text-align:center;
border:1px solid #000;
padding: 0px;
}section{
background-color:#fff;
margin-top:10px;
width:900px;
height:500px;
float:left;
}aside{
margin-left:10px;
background-color:#fff;
width:290px;
margin-top:10px;
height:500px;
float:left;
margin-bottom:10px;
}footer{
background-color:#fff;
width:1200px;
height: 100px;
clear:both;
}
.container{
background-color:#ccc;
border:1px solid #000;
width:1200px;
margin:auto;
}não funcionou!
eu queria deixar o background do li ativo em cada pagina que navego no site.
obrigado!
pelo que eu vi ai. você chama várias páginas
no menu de cada página tem que colocar o active.
/ SALVA A PÁGINA INDEX.HTML /
<li><a href="index.html" class="active">Home</a></li>
/ SALVA A PÁGINA NEWS.HTML /
<li><a href="news.html" class="active">Home</a></li>
/ assim em todas as páginas /
cada uma com o seu ative em cada página.
se desejar pode colocar
nav#menu a:active{
display:inline-block;
padding:10px;
color: /* COLOQUE A COR */ ;
}sera que estou fazendo algo errado?
este class active eu tenho q colocar em todos os links?
>
sera que estou fazendo algo errado?
este class active eu tenho q colocar em todos os links?
sim mas cada um em sua respectiva página. se o visitante ta na primeira página o único active deve ser o
<li><a href="index.html" class="active">Home</a></li>
<li><a href="news.html" >news</a></li>
<li><a href="fotos.html" >Fotos</a></li>
....
só vai colocar active em um por página logo no link da página que você vai salvar.<li><a href="index.html" >Home</a></li>
<li><a href="news.html" class="active" >news</a></li>
<li><a href="fotos.html" >Fotos</a></li>e assim por diante.
tem alguma coisa errada!
estou desde cedo tentando uma solução
agora estou apelando para o site
socorro
esta class aonde você aponta para ela no css?
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.fh5co-nav ul li{
float: left;
margin-left: 2%;
color: #000;
}
.fh5co-nav a{
text-decoration: none;
color: #000;
}
.fh5co-nav ul li.active > a {
color: #2E8B57 !important;
text-decoration: none;
}
</style>
</head>
<body>
<div class="fh5co-nav">
<ul>
<li class="active"><a href="index.html">Home</a></li>
<li ><a href="index.html">Home</a></li>
</ul>
</div>
</body>
</html>Valeu fera! obrigado você me ajudou demais.
o erro estava no codigo anteriorq não apontava para a class: a:active
nesse codigo você foi grande: a.actice .
fechou muito obrigado!!!
agora já sei onde recorrer quando estiver no sufoco.
http://www.w3schools.com/cssref/sel_active.asp
nav#menu li a:active{