Dar estilo a los links visitados con CSS
Mayo 27th, 2007 | Publicado por Francisco en CSS | 4 Comentarios
Como muchos saben, mediante CSS es posible manejar la apariencia de los links, ya sean activos, al pasar el mouse encima y los visitados. Y en este artículo te mostraremos algunas opciones de estilos para los links ya visitados en nuestro sitio y de este modo ayudar a nuestro usuarios a diferenciar lo que ya vio de lo que no.
Efecto: Tachado
Ejemplo: Link visitado
Código:
a:visited {
text-decoration: line-through;
}
Es un efecto sencillo pero efetivo.
Efecto: Subrayado personalizado
Ejemplo: Link visitado
Código:
a:visited {
border-bottom: 1px dotted #6c6c6c;
text-decoration: none;
}
Sencillo y personalizable.
Efecto: Icono lateral
Código:
a:visited {
padding-right: 12px;
background: url(http://bp0.blogger.com/_Zuzii37VUO4/RliVkJya0kI/AAAAAAAABks/zwQFwD937-g/s1600/icono-visitado.gif) no-repeat 100% 50%;
}
Es una forma más gráfica y muy personalisable.
Efecto: Texto indicativo.
Ejemplo: Link visitado YA VISITADO
Código:
a:visited:after {
content: " (YA VISITADO)";
font-size: 60%;
text-transform: uppercase;
color: #777;
}
Este método usa pseudoelementos, por lo que no funciona en las versiónes anteriores de IE7.
Son métodos faciles de utilizar y muchas veces muy utiles.
Encuentra más sobre esto en maratz




Mayo 27th, 2007 a las 1:53 am (#)
Si, pero te has olvidado donde colocar al código!
Mayo 27th, 2007 a las 3:09 am (#)
Lo que pasa es que este código no es sólo para Blogger, sino para cualquier sitio o blog. Va en la hoja de estilos y en el caso de blogger, sobre
]]></b:skin>
Igualmente gracias por el apunte.
Mayo 27th, 2007 a las 4:42 am (#)
En Blogger de todas formas siempre exíste la posibilidad de diferenciar con colores los links visitas y los que no.
Mayo 27th, 2007 a las 5:03 am (#)
Claro, es la forma más usual y es efectiva, están son algunas unas opciones más