2011-08-31 23 views
11

Me pregunto cuál es la mejor solución para que una imagen de fondo se ajuste a todas las pantallas, a todos los navegadores. También noté que la mayoría de las técnicas recortan la imagen un poco. Sé que hay muchas técnicas para hacer esto, pero quiero saber cuál es la mejor en su opinión. Gracias!css fondo de imagen de pantalla completa perfecta

+0

I no creo que realmente haya una solución para todos. Su solución dependerá en gran medida de cómo se vea su imagen y cómo se aplica. Por ejemplo, muchas imágenes de fondo dejan una gran brecha en el ancho de su área de contenido en el centro de la imagen. Mientras que otra imagen de fondo se muestra a través del área de contenido. Algunos repiten. Existen varias técnicas para imágenes de fondo pero difieren según el diseño. – Jrod

+0

http://css-tricks.com/3458-perfect-full-page-background-image/ - Método jquery - probablemente la mejor solución. – easwee

Respuesta

23

Este post from CSS-tricks.com cubre diferentes técnicas para imágenes de fondo de pantalla completa e incluye un respaldo para versiones anteriores de IE (no he probado la solución de IE).

Cuando no tiene que preocuparse por el apoyo a los navegadores antiguos, por lo general utilizan el método de CSS3:

html { 
    background: url(http://lorempixum.com/1440/900/sports) 
     no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 
+0

Demasiado, lo sé, pero ¿hay una buena alternativa a esto que no cambie de tamaño con el navegador? Ojalá pudiera dar solo la imagen a una altura mínima –

Cuestiones relacionadas