Personalizar la Nube de Etiquetas con CSS del blogger

Hace unos días expliqué como Personalizar la Nube de Etiquetas con CSS en Blogger y compartí con vosotros algunos diseños que hice. Hoy comparto otro diseño muy bonito que he encontrado en Stylifyyourblog.

Cómo instalarlo en tu Blogger

1. Instalar el Gadget de Etiquetas para Blogger. Si no lo tienes instalado explico cómo hacerlo en Personalizar la Nube de Etiquetas con CSS.
2. Ir a Escritorio Blogger.
3. En el menú seleccionamos Plantilla.
4. Hacemos clic en Editar HTML.
5. En el código buscamos lo siguiente:

]] ></b:skin>



6. Encima de ello tenemos que pegar el siguiente código:

label-size{ margin:0; padding:0; position:relative; } .label-size a{ float:left; height:24px; line-height:24px; position:relative; font-size:12px; margin-bottom: 9px; margin-left:20px; padding:0 10px 0 12px; background:#0089e0; color:#fff; text-decoration:none; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px; border-top-right-radius:4px; } .label-size a:before{ content:""; float:left; position:absolute; top:0; left:-12px; width:0; height:0; border-color:transparent #0089e0 transparent transparent; border-style:solid; border-width:12px 12px 12px 0; } .label-size a:after{ content:""; position:absolute; top:10px; left:0; float:left; width:4px; height:4px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; background:#fff; -moz-box-shadow:-1px -1px 2px #004977; -webkit-box-shadow:-1px -1px 2px #004977; box-shadow:-1px -1px 2px #004977; } .label-size a:hover{background:#555;} .label-size a:hover:before{border-color:transparent #555 transparent transparent;}