Tutoriales {Menú personalizado por ti!}

Hola! sigo recondando de que participen en el concurso, parece que lo voy a suspender por los pocos participantes que hay, en fin. Este tutorial es muy sencillo, me encanta porque es muy fácil de personalizar ya que editaremos sólo los menús por defecto que traen las plantillas de Blogger pero aún así las pondremos a nuestra talla ;)

Menú Personalizado

/* Clic a la imagen para ver en tamaño original */

Pasos a seguir:

/* Tabs

 .tabs-inner {
  margin: .5em $(tabs.margin.sides) $(tabs.margin.bottom);
  padding: 0;
}
.tabs-inner .section {
  margin: 0;
}
.tabs-inner .widget ul {
  padding: 0;
  background: url(URL DE LA IMAGEN); /* Imagen de fondo del menú */
}
.tabs-inner .widget li {
  border: none;
}
.tabs-inner .widget li a {
  display: inline-block;
  padding: .5em 1em;
  color: #fff; /* Color de la font */
  font-family: 'Patrick Hand SC', cursive; /* Estilo de la font */
  font-size: 16px; /* Tamaño de la letra */
  background: url(URL DE LA IMAGEN); /* Imagen de fondo de las categorías/páginas */
  border-$endSide: 1px solid transparent;
}
.tabs-inner .widget li.selected a,
.tabs-inner .widget li a:hover {
  position: relative;
  background: url(URL DE LA IMAGEN);  /* Imagen de fondo de las categorías/páginas al pasar el cursor */
  color: #D7CFFF; /* Color de la font al pasar el cursor */
}
.PageList { /* Esto es para que el menú quede centrado, si no lo quieres borra desde esta línea en adelante */
text-align:center !important;
}
.PageList li {
display:inline !important;
float:none !important;
}

Espero les haya gustado este tutorial tan fácil, si tienen alguna duda o problema avísenme y por supuesto intentaré solucionarlo. Nos leemos!~