Como centrar un Background con CSS
Publicado en css el 25/08/06 a las 06:33 pm
Hoy estuve buscando la manera de centrar un background en el centro de una página, después de un rato de búsqueda he aquí el resultado:
body {
background: transparent url(imagen.jpg) no-repeat center center;
background-attachment: fixed;
}
Gracias a Pablo por el fixed.
15 } Comentarios
Dr. Bizarre
Comento el 25/08/06 a las 10:44 pm
ya esta en mi del.icio.us (y)
Victor Bracco
Comento el 26/08/06 a las 03:33 pm
Ya esta en mi sabro.us!
Octavio Alvarez
Comento el 27/08/06 a las 10:54 am
Cabe mencionar que al hacer scrolling esta técnica utiliza más procesador que los fondos no-fixed, pues a cada scroll hay que volver a renderear toda la página.
En máquinas viejas (< 500Mhz) la página se verá torpe, lenta, a menos que haya una buena tarjeta de video.
stan
Comento el 28/08/06 a las 10:24 am
no habia pensado en ese inconveniente Octavio, creo que probare con unas de 300 mhz haner que resulta :D
josue
Comento el 28/08/06 a las 12:29 pm
quiero conocer gente nueva de todas partes del planeta!!!!!!!!
zoftweb
Comento el 28/08/06 a las 11:35 pm
que tal si empiezas por tu colonia? :P
Mario A Chavez
Comento el 29/08/06 a las 12:51 am
Ja, ja ... zoftweb, muy buena tu respuesta !
Octavio Alvarez
Comento el 29/08/06 a las 11:59 am
Zoftweb, excelente respuesta. Tengo que admitir que yo sufro del mismo síndrome.
Victor
Comento el 29/08/06 a las 02:43 pm
jajaja, se pasan. jajaja
Mudanzas
Comento el 20/09/06 a las 02:01 pm
Una información muy util ;) Te sigo leyendo.
Diseño Web
Comento el 03/07/08 a las 05:59 am
Con esta respuesta has solucionado muchos problemas. Gracias
bardo
Comento el 01/10/08 a las 05:48 am
Estoy hojeando el blog y copiando código a diestro y siniestro, me está siendo muy útil .Muchas gracias
Jordi
Comento el 04/10/08 a las 08:40 am
Muchas gracias por el artículo. Me gustaría añadir que si queréis centrar el fondo y además que aparezca en la parte superior, debéis poner el siguiente código:
body {
background:url(Assets/header.gif) no-repeat top center;
background-attachment: fixed;
}
Espero que sirva de ayuda.
Bernardo
Comento el 01/04/09 a las 12:22 pm
Genial!!!
ricardo
Comento el 15/10/09 a las 07:25 pm
muy buena información, busque mucho un ejemplo asÃ... gracias