Entrar

Link css

ayosefj92 · · Solicitar retirada
Hola, bueno desp de comprar un diseño y tener unos problemas con las medidas y eso , me decidí hacer el diseño yo para no tener problemas y todo encaje bien.

Tengo una duda de css (que soy muy malo jajaaj), me gustaría ponerle a la palabra de color gris y cuando pasa el raton por encima de ella que pase a color azul.
lantiga · · Solicitar retirada
supongo que se refiere a una transición de hover asociada a un evento mouse.
Rabs · · Solicitar retirada
Es facil, por ejemplo, la palabra que quieres que le pase eso es: "paracaidas"
En caso de que sea con un link, la forma mas facil de hacerlo seria la siguiente:

Tenemos ya de por si un codigo:
<p>El avion se iba a estrellar y yo debia usar el<a href="direccion"> paracaidas</a> de emergencia.</p>

Lo que hacemos ahora es darle un nombre a la palabra o palabras que queremos que surga un efecto:
<p>El avion se iba a estrellar y yo debia usar el <a href="direccion" class="nombre-para-definir">paracaidas </a> de emergencia.</p>

Ahora en el .css podríamos:
.nombre-para-definir a {color:gray}
.nombre-para-definir a:hover {color: blue}

Si lo que deaseas es en texto sería asi:
Tendría el texto tal que asi
<p>El avion se iba a estrellar y yo debia usar el paracaidas de emergencia.</p>
Y ahora solo deverías poner:

<p>El avion se iba a estrellar y yo debia usar el <span class="nombre-para-definir">paracaidas </span> de emergencia.</p>
Lo que esto hace es identificaro, y ahora en la .css:

.nombre-para-definir p {color:gray}
.nombre-para-definir p:hover {color: blue}
Pongo p por que está entre las etiquetas <p> y </p>, pero si por ejemplo estuviese entre <u> y </u>, solo habría que cambiar la p por la u y ya esta :P
Doodleo · · Solicitar retirada
Rabs, eso del span que dices no me funciona.

Lo correcto sería usar como dice lantiga
ayosefj92 · · Solicitar retirada
hola rabs, muy buena respuesta y muy completa jeje, lo que no me funciona:

<html>
<head>

<style type="text/css">
<!--
.link_gris a {color:gray}
.link_gris a:hover {color: blue}

-->
</style>
</head>

<body>

<p><a href="#" class="link_gris">hola </a></p>

</body>
</html>
Rabs · · Solicitar retirada
ayosefj92, como que no te funciona el que? Asi tal cual yo te diria que no funciona por que lo estas invalidando como si fuera un comentario. Y Doodleo, esas seguro? Voy a probar a ver en que he fallado ok?
lantiga · · Solicitar retirada
os pongo un ejemplo y haber si sois capaces de hacerlo, vale?

El ejemplo básicamente lo que hace es que una imagen con una opacidad o canal alpha se vuelva más visible cuando al ratón esta encima de dicha imagen :

<a  href="http://cmmwebmaster.zobyhost.com/index.php"><img  src="../img/home2.png" width="70" height="35" alt="inicio"
style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" /></a>
Rabs · · Solicitar retirada
Yo pensaba hacerlo mediante Css, pero latinga ya tiene: Hay va un puntito de reputacion (Que es lo amximo que puedo dar hehe)
JorGens · · Solicitar retirada
Esos símbolos de comentario no anulan los estilos. Ahora mismo no recuerdo el porqué, pero es la forma correcta de colocar estilos en la cabecera.

Cosas de la vida. Si lo recuerdo os digo el porqué.

Un abrazo!
lantiga · · Solicitar retirada
Lo importante es aprender no los puntos pero se agradece un montón créeme, eso significa que valorais mi opinión y eso no tiene precio.GRACIAS.
Rabs · · Solicitar retirada
latinga, era solo por que te lo merecias ;P Pero ayosefj92 si quieres lo reviso y te lo pongo como es debido ok?
Doodleo · · Solicitar retirada
/* Estilos para cuando estás presionando el enlace */
A.link_cambiante:active {color:#[COLOR="red"]ffffff[/COLOR];}

/* Estilos para cuando ya has visitado ese link /*
A.link_cambiante:visited {color:#[COLOR="red"]ffffff[/COLOR];}

/* Estilos para el color del link cuando no le haces nada */
A.link_cambiante:link {color:#[COLOR="red"]ffffff[/COLOR];}

/* Estilos para cuando pasas el ratón por encima del enlace */
A.link_cambiante:hover {color:#[COLOR="red"]ffff33[/COLOR];}

Y en el enlace:
<a href="#" class="link_cambiante">enlace</a>
JorGens · · Solicitar retirada
Cómo que no tiene precio? Son 10 euros compañero!

je je je je
Recordad poner las etiquetas en minuscula, para ir acostumbrándonos! je je. (a ver si recuerdo pasar a minúsculas los codigos html de las lecciones...)
Rabs · · Solicitar retirada
aa pero que es para un enlace... Entonzes es MUY MUY FACIL, doodleo lo acaba de poner. Con un link es facilisimo :P Pero con p ya hay que hacer cosas mas dificiles hehe
Rabs · · Solicitar retirada
Coincido con Jorgens
No, por que eso le dice al CSS que es un link y no otra cosa, y asi poder configurarlo como se merece (creo)
Doodleo · · Solicitar retirada
No, lo que le puedes cambiar es lo que pone después de la a que pone link_cambiante (recuerda cambiar entonces el class="link_cambiante" del enlace!)

"A" se refiere a que es un enlace