CÓMO PONER UN FONDO TRAS EL MENÚ DE PÁGINAS

Este efecto lo puedes ver claramente en el menú de páginas de mi blog. Esos circulitos rosas de fondo. Pues bien con este tutorial puedes poner la imagen que quieras.

Necesitas tener lo que es la "base" del fondo, y al igual que con los fondos de los blogs, ha de ser "seamless". O sea, tienes que tener en cuenta que se va a repetir. Puedes buscar en google imágenes hasta encontrar el que te guste.

Luego añades en CSS:

.tabs-inner .widget ul {
background: url(URL fondo) repeat-x;
height: 45px;
/*pdb*/
}

Poniendo en el paréntesis la URL de la imagen que vas a usar como fondo, y cambiando el 45 (altura) por el alto de tu imagen. Para saber la URL de una imagen yo la subo en una entrada borrador, luego pinchas en ella con el botón derecho del ratón y le das a copiar la ruta del enlace. Despúes lo pegas en el paréntesis ese sustituyendo (URL fondo) por lo que hayas copiado.

Si no quieres que se repita (porque no es un patrón seamless o porque te resulta más fácil diseñarlo así), deberás ponerle también el ancho de lo que mide (donde dice width).

Lo único que tienes que tener en cuenta que entonces si cambias un día el ancho del blog, deberás repetirlo, mientras que de la otra manera puedes cambiarlo y seguiría quedando bien.

Es probable además que debas ajustarlo un poco, moviéndolo hacia derecha o izquierda. Yo ya he puesto margin-left en el código para moverlo un poco, pero deberás cambiar el -40 por lo que necesites:

.tabs-inner .widget ul {
background: url() repeat-x;
height: 49px;
width: 943px;
margin-left: -40px;
/*pdb*/
}

Usa el segundo código sólo en caso de que la imagen no sea un patrón seamless. Osea todo el rato el mismo patrón, no se si me entiendes. No es lo mismo un fondo de estampado zebra que la foto de alguien. Espero que con esto me entiendas. El fondo zebra sería un fondo seamless. ok?

Espero que te haya gustado.

Besos,