Pequeño snippet de CSS para conseguir una web con una imagen de fondo a pantalla completa. La solución funciona en todo tipo de dispositivos, escritorio y móviles.
|
1 2 |
html, body { overflow: hidden; height: 100%;} body {margin: 0; padding: 0; background: #ffffff url("bg.png") repeat-x 50% 50% / contain;} |
El último parámetro de background, / contain, es background-size y define cómo se comporta la imagen en diferentes proporciones de pantalla. Dos valores interesantes son contain y cover.