domingo, 8 de julio de 2012

Varios métodos para diferenciar los enlaces

Basándonos en lo que dice html5rocks.com, podemos jugar con los selectores para diferenciar los enlaces de modo muy preciso y, de ese modo, establecer variantes gráficas surtidas, personales, locas o casi cualquier cosa.

Por ejemplo, quisiéramos diferenciar los enlaces internos a nuestro sitio de los enlaces externos, podríamos agregar propiedades especificas para que nuestros propios enlaces, se viesen distintos, usando parte de la URL del blog; en mi caso:
a[href*="vagabundia."] {
/* acá las propiedades */
}

Lo mismo podríamos hacer de modo inverso, establecer una regla para que lo que se vea distinto sean los enlaces externos:
a[href ^= 'http']:not([href *= 'vagabundia.']) {
/* acá las propiedades */
}

Y así podemos seguir siendo más y más específicos y, en Blogger, diferenciar los enlaces de entradas de cierto año:
a[href*="vagabundia."][href*="/2012/"] {color:Aquamarine;}
de las etiquetas:
a[href*="vagabundia."][href*="/label/"] {color:Salmon;}
o de las páginas estáticas:
a[href*="vagabundia."][href*="/p/"] {color:Thistle;}

No hay comentarios:

Publicar un comentario