Menú KBR

Annyeonghaseyo! Hoy traigo otro tutorial de otro menú y es el menú que estoy usando para las etiquetas, que es muy simple y bonito (a ver... que todos los menús que voy a subir son bonitos).

P R E V I EW

1. Lo primero es ir a Tema > Personalizar > Editar HTML y buscamos ]]></b:skin> y justo encima colocamos el siguiente código:

kbr {
background:#ebc0cb; /* color de fondo del menú */
text-align: center;
font: Tinos; /* fuente */
font-size: 11px; /* tamaño de la fuente */
color: #fff; /* color de la fuente */
letter-spacing:1px; /* espacio entre las letras */
padding: 4px;
margin: 2px;
float: left;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
-webkit-transition-duration: .90s; /* tiempo del efecto */
}

kbr:hover {
background:#dbdfeb; /* color del fondo al pasar el ratón */
text-align: center;
font-size: 11px; /* tamaño de la fuente al pasar el ratón */
color: #fff; /* color de la fuente al pasar el ratón */
letter-spacing:1px; /* espacio entre las letras */
padding: 4px;
margin: 2px;
float: left;
-moz-border-radius: 10px 25px / 25px 10px;
border-radius: 10px 25px / 25px 10px;
-webkit-transition-duration: .90s; /* tiempo del efecto */
}

Todo lo que está subrayado se puede modificar, lo demás también, pero si no controláis html es mejor dejarlo tal y como está.

2. Ahora agregamos un gadget HTML/Javascript con el siguiente código:

<a href="LINK"><kbr>TEXTO</kbr></a>
<a href="LINK"><kbr>TEXTO</kbr></a>
<a href="LINK"><kbr>TEXTO</kbr></a>
<a href="LINK"><kbr>TEXTO</kbr></a>
<a href="LINK"><kbr>TEXTO</kbr></a>
<a href="LINK"><kbr>TEXTO</kbr></a>

Y de nuevo, todo lo que está subrayado se puede modificar, además de agregar más.