Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia pessoal, Quero fazer um link com o titulo de uma cor e o texto em outra, mas quando passar o mouse em cima queria que a cor dos dois ficasse igual Meu codigo está assim: <style type="text/css">
a.ChamadaNoticias:link{text-decoration:none. }
a.ChamadaNoticias:visited{text-decoration:none. }
a.ChamadaNoticias:hover{color: #00FF05. text-decoration:underline. }.tituloA{font-family:'Open Sans', sans-serif. color:#00698C. font-size:16px. font-weight:bold. }.textoB{font-family:'Open Sans', sans-serif. color:#333. font-size:16px. }
</style>
<a href="#" class="ChamadaNoticias">
<div class="tituloA">Titulo da noticia</div>
<div class="textoB">Aqui vai uma breve descrição da noticia</div>
</a> Como preciso fazer com meu CSS para quando passar o mouse em cima mudar a cor do titulo e do texto para mesma cor?Poxa nao sabia que era tão simples assim... só mais uma pergunta se dentro dos elementos eu tiver uma imagem e quiser que ela mude de cor ou mude a imagem, dá pra fazer com CSS ?
>
2 horas atrás, danicarla disse:
imagem e quiser que ela mude de cor
Mudar imagem de cor? Você diz plano de fundo "background"?
Em fim segue a mesma questão....
Só que uma imagem provém de elemento <img> não dar.... E dar...
<style>
.exemplo > .imagem-b {
display: none
}
.exemplo:hover > .imagem-a {
display: none
}
.exemplo:hover > .imagem-b {
display: block
}
</style>
<div class="exemplo">
<img src="imagem-a.formato" alt="" class="imagem-a"/>
<img src="imagem-b.formato" alt="" class="imagem-b"/>
</div>
Na verdade não estamos trocando a imagem apenas ocultando uma e exibindo outra... Para esse tipo de situação eu prefiro usar javascript e realmente trocar o valor do atributo SRC.
Porém podemos fazer de forma simples com o css.
<style>
.exemplo > .imagem {
background-image: url('imagem-a.formato');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
height: 100px
}
.exemplo:hover > .imagem {
background-image: url('imagem-b.formato') !important
}
</style>
<div class="exemplo">
<div class="imagem"></div>
</div>Vou continuar usando javascript mesmo.. obrigada pela ajuda
a.ChamadaNoticias:hover * {
color: #00FF05
}
Nesse caso quando o elemento <a> cujo seu classificador seja ChamadaNoticias sofrer evento hover, referimos que qualquer (*) outro elemento interno tenha a cor de texto que desejamos.