Imagen de fondo web adaptable a cualquier resolucion

Dar un toque elegante a una pagina es importante, puedes usar una imagen como fondo web, pero no olvides que cada imagen tiene unas proporciones, y que existen pantallas de diversas resoluciones. Para que la imagen no se deforme al cambiar el tamaño de la ventana o la resolución existen varias opciones, cada una de las cuales tiene sus pros y sus contras. Vamos a ver tres opciones: CSS, Javascript y un plugin Jquery.

CSS

Lo mas sencillo, es usar CSS. Y lo haremos con la propiedad background-size y su valor cover, el cual redimensiona automáticamente la imagen al variar el tamaño de la ventana.

El problema de realizar esta operación con CSS, es que no funciona con los navegadores anteriores a IE9. Deberemos usar las otras opciones.

Javascript

Aquí, deberemos de seguir tres sencillos pasos.

Jquery Usaremos este plugin: http://srobbin.com/jquery-plugins/backstretch/

Para cualquiera de las dos ultimas opciones es interesante incluir esta meta:

Saca tu conclusión…

 

Imagen de fondo web adaptable a cualquier resolucion
5 (100%) 1 Voto

Agregar comentario

Suscribete

Suscribete a nuestro newsletter y mantente informado con nuestros últimos artículos, noticias y más. Todo completamente gratis.

Tu suscripción a sido realizada con éxito.