Estilo para el widget del Archivo, estilo lista


Para añadir este estilo en el gadget Archivo estilo lista en tu blog de blogger
  1. Configurar el gadget Archivo estilo lista
  2.  ir a:

  • Plantilla
  • Personalizar
  • Diseñador de Plantillas
  • Avanzado
  • Añadir código CSS personalizado en el recuadro pegar el siguiente código:


/*--Estilos para el widget del Archivo, estilo lista--*/
#BlogArchive1 {
margin: 14px 0;
padding: 0;
border: 2px dotted #cccccc; /*borde de la caja*/
}
#BlogArchive1 h2 {
padding: 14px 0 9px 7px; /*padding para ampliar el espacio del titulo*/
margin: 0;
border: 1px solid #ffffff; /*el borde del título*/
font-size: 16px; /*El tamaño de la fuente del titulo*/
color: #2A1B0A; /*color de la fuente del título*/
background: #fce5cd; /*color de fondo del título*/
text-shadow: 1px 1px 1px #ffffff; /*sombra en el texto*/
}
#BlogArchive1_ArchiveList ul.flat li {
display: block; /*creamos el bloque*/
width:225px;
font-size: 14px;
color: #2A1B0A;
padding: 10px !important;/* para ampliar el bloque*/
margin:0;
text-decoration: none;
text-align: left; /*alineamos el texto a la izq. si quieres centralo poner: center*/
background: #33aaff; /*el color de fondo*/
transition: all 1.0s linear; /*las transiciones para cada navegador*/
-o-transition: all 1.0s linear;
-moz-transition: all 1.0s linear;
-webkit-transition: all 1.0s linear;
border-bottom: 1px solid #ffffff; /*borde abajo para cerrar la caja*/
border-left: 1px solid #ffffff; /*borde blanco a la izq.*/
border-right: 1px solid #ffffff; /*borde blanco a la derecha*/
}
#BlogArchive1_ArchiveList ul.flat li a {
text-decoration: none;
color: #2A1B0A;
}
#BlogArchive1_ArchiveList ul.flat li:hover {
background: #b4a7d6; /*el color del fondo para el efecto hover*/
}

Cambiar los valores que están en rojo para personalizar el color.
width: es el ancho del bloque, tendrás que ajustarlo según tu diseño.


No hay comentarios:

Publicar un comentario

Entradas aleatorias