IE7: Detectar automáticamente que links son externos con CSS

0 COMENTARIOS -  Publicado hace 41 meses -  Clasificado en: , ,

Siguiendo con las ventajas que aporta el nuevo Internet Explorer 7, respecto a la version 6, es que además de las especificaciones CSS2, ya soporta algunos de los nuevos atributos basados en selectores CSS3. Por ejemplo, haciendo uso del operador ^= (que nos permite seleccionar solo aquellos elementos cuyo atributo especificado coincida, al comienzo de la cadena, con el valor especificado) podremos crear una reglas para determinar el aspecto de nuestros links en función de si son externos o internos. Marcaremos como externos todos los enlaces cuyo href comience con la cadena "http:":

/*ENLACES INTERNOS*/
a {
background-color: #666;
color: #FFF;
font-weight: bold;
text-decoration: none;
padding-bottom: 1px;
}
a:hover {
background-color: #FAF3EC;
color:#666;
}
/*ENLACES EXTERNOS*/
a[href^="http:"] {
color: #FFF;
background-color: #F00;
}
a[href^="http:"]:hover {
background-color: #FAF3EC;
color:#666;
}

Ver ejemplo en funcionamiento » »

Otra aplicación podría ser marcar de un modo distinto los enlaces a correo electrónico:

a[href^="mailto:"]

Esto funciona tanto en IE7 como en Mozilla.

También te puede interesar:

Haz un comentario

¡Gracias por dejar tu opinión! Por favor procura que tu comentarios sean apropiados respecto al tema tratado en la entrada; que no sean spam, u ofensivos, de otro modo, serán eliminados. Todos los comentarios serán moderados antes de su publicación por lo que su aparición en la web puede verse aplazada un cierto tiempo. Si deseas realizar algún comentario, crítica o sugerencia sobre la propia web puedes hacer a través de la siguiente dirección de correo: webintenta@webintenta.com