IMAGEN DE FONDO EN MOSAICO

Buenas tardes,

Estoy muy nuevo en CSS tengo años escuchándolo pero jamas me había puesto a estudiarlo. El problema que tengo es que he visto en muchas plantillas que crean imagenes de fondos a partir de una imagen valga la redundancia de 900px x 80px y dicha imagen con ccs la repiten y es una imagen continua pero cuando lo intento me la divide en mosaico o la muestra en mosaico y obviamente no se ve la continuidad.

Quisiera saber si me pueden ayudar con esto.

Gracias

Creo que el problema lo tienes al crear la imagen que te servirá de patrón. css lo que hace es ir repitiendo la imagen para rellenar todo el fondo, nada más.

Busca info para crear mosaicos, por ejemplo: http://www.photoshopessentials.com/basics/repeating-patterns-intro/

De todas formas, pon algún enlace de los ejemplos que has visto, para ver a qué te refieres.

walden escribió:

Gracias por responder.

Creo no me explique bien, yo no quiero que se vea la imagen en Mosaicos quiero que este extendida, pero no se ve así, sino que justamente parece un mosaico y es lo que no quiero.

Gracias nuevamente.

Entonces, ¿qué necesitas? ¿poner una imagen de fondo, que no se repita y que se ajuste al ancho de la ventana, aunque se deforme?

Hola Walden,

Ya esta listo, no se que pasaba, pero elimine el bloque del body, lo volví a escribir y se solucionó, el problema era que la imagen se cortaba cada vez que terminaba, formando un mosaico, pero ahora si aparece completamente extendida.

Gracias a todos. SOLUCIONADO.

¿Y cómo lo hiciste?. Sería interesante que comentaras la solución para quien se encuentre con el mismo problema.

Lo que habría hecho yo es usar background-size: cover; en el CSS.

Buenas noches,

Bueno para aclarar un poco, realice una imagen vectorial en fireworks y de unos 900x80 y quería que la misma se repitiera verticalmente, pues no sucedía, el código que utilice fue el siguiente

Código CSS :

body {

    background-color: #fff;
   background-image: url(img/fondoazul.png);
   background-attachment: fixed;
    background-repeat: repeat-y;
    background-position: 50% 50%;
    color: #666;
    font-family: Arial, sans-serif;
    font-size: 12pt;
}

Resulta que la imagen se cortaba y volvía a comenzar dejando así el efecto de un mosaico, y yo lo que quería es fuera extendida, hice todas las pruebas que se me ocurrieron, hasta que decidí eliminar el bloque y volverlo a crear y funciono.