tag link + active no css não funcionou

Front-end

07/07/2015

Boa tarde, mais um erro meu, acho que esse não é tão simples! 


.tag_ul a:active{
	background:red;
}
Gabriela Monte

Gabriela Monte

Curtidas 0

Respostas

Marcelo Pastore

Marcelo Pastore

07/07/2015

Já verificou todos os códigos com calma Gabriela?
GOSTEI 0
Jothaz

Jothaz

07/07/2015

Boa tarde, mais um erro meu, acho que esse não é tão simples! 


.tag_ul a:active{
	background:red;
}


É recomendável que sempre que postar um CSS postar também o código HTML onde o CSS será usado e claro uma descrição do que se espera na execução do código, assim facilita o entendimento e consequentemente a ajuda.

Considero o uso de CSS bem trivial, mas como existe a herença entre as tag é muito fácil se perder na sua configuração.

Sou meio lerdo, para não dizer burro mesmo kk, mas vou supor que você pretende manipular um link (<a href...).

<html>
<head>
 
  <style type='text/css'>
    .tag_ul a:active{
    background:purple;
}

/*
.tag_ul a:hover { 
    background-color: yellow;
    font-size: 250%;
}
*/
  </style>

</head>
<body>
  <a class="tag_ul" href="#">Opção 01</a>
<br /><br />
<div class="tag_ul">
    <a href="#">Opção 03</a>
</div>
  
</body>


</html>


Código funcionando no jsfiddle

[img]http://arquivo.devmedia.com.br/forum/imagem/418027-20150707-204551.png[/img]

Na tag <a href> direto não funciona, mas dentro de um DIV funciona.
Porém só age quando você executa o click e segura, depois perde o efeito.
Coloquei o "hover" comentado que é aplicado ao passar o mouse sobre o controle, se quiser retire o comentário e teste.

Se possível descreva com mais detalhes o que você pretende.
Mas espero que o exemplo acima possa aclarar um pouco o seu questionamento.
GOSTEI 0
Gabriela Monte

Gabriela Monte

07/07/2015

Complicou pra mim! kkkkk

Vou tentar entender, qualquer coisa posto o código amanha! ok?
GOSTEI 0
Marcelo Pastore

Marcelo Pastore

07/07/2015

Posta o código completo, é melhor!
GOSTEI 0
Jothaz

Jothaz

07/07/2015

Complicou pra mim! kkkkk

Vou tentar entender, qualquer coisa posto o código amanha! ok?
Posta o código completo, é melhor!


O intuito não foi complicar, mas sem o HTML ou uma descrição simples do resultado/comportamento esperado, fica mais difícil sugerir algo.

Só um esclarecimento adicional, quando você usa:

 .tag_ul a:active{
    background:purple;
}


Basicamente você esta dizendo que o link (<a href) dentro de uma outra tag (Div, Table, Span, P ou qualquer outra) vai mudar o Background quando for clicado.
Então por isso que no meu exemplo usei a <a href> dentro de uma Div, poderia ser qualquer uma das outras tags que enumerei.

Se quiser aplicar o estilo direto na tag <a href> use assim:

Css:
 a:active{
    background:purple;
}


HTML:

  <a  href="#">Opção 01</a>


Ai vai funcionar.
GOSTEI 0
Gabriela Monte

Gabriela Monte

07/07/2015

Jothaz e Marcelo, para entender melhor!

O html:

<html>
	<head>
		<title>Titulo da pagina</title>
		
		<link href="estilo01.css" rel="stylesheet" type="text/css"		
	</head>
	<body>
		<ul class="aula13_ul">
			<li><a href="#">Weblink</li>
			<li><a href="#">Weblink</li>
			<li><a href="#">Weblink</li>
			<li><a href="#">Weblink</li>
			<li><a href="#">Weblink</li>
			<li><a href="#">Weblink</li>
			<li><a href="#">Weblink</li>			
		</ul>	
	</body>
</html>


O CSS:

.aula13_ul{
	padding:0px;
	margin:0px;
	list-style-type:none;	
	background:#8B668B;
	width:940px;
	margin-left:auto;
	margin-right:auto;
	padding-top:8px;
	padding-bottom:8px;
}

.aula13_ul > li{
	display:inline;	
	margin:8px;
	margin-left:0px;
	margin-right:0px;
}

.aula13_ul a{
	color:white;
	text-decoration:none;
	padding:8px;
	padding-left:20px;
	padding-right:20px;
}

.aula13_ul a:hover{
	background:black;
	text-decoration:underline;
}

.aula13_ul a:active{
	background:red;
}

.aula13_ul a:visited{
	background:yellow;
}
GOSTEI 0
Jothaz

Jothaz

07/07/2015

Postando o código fica bem mais fácil ajudar e compreender o resultado esperado. kk

Você não tinha fechado as Tag <a href....> </a>, algumas versões de browsers rodam sem problemas outras não.
Por mais cansativo e chato que seja sempre feche as tags, inclusive as <br />, assim você evita transtornos.

Código corrigido
 <ul class="aula13_ul">
     <li><a href="#">Weblink</a></li>
     <li><a href="#">Weblink</a></li>
     <li><a href="#">Weblink</a></li>
</ul>


Exemplo funcionando no fiddle


[img]http://arquivo.devmedia.com.br/forum/imagem/418027-20150708-161727.png[/img]
GOSTEI 0
Gabriela Monte

Gabriela Monte

07/07/2015

Agora sim!!! Perfeito Agora.
GOSTEI 0
POSTAR