Página personal de Hector Mulet

Imágenes Responsive

Según el tamaño del dispositivo visualizador se verá una u otra imagen. Observaremos que dentro del elemento <picture> necesitaremos una etiqueta <img> que nos servirá como imagen "comodín" por si no funcionan las demás. Otra cosa que debemos tener en cuenta es que las etiquetas <source> deberán estar ordenadas según el atributo media="(min-width:#px)", la imagen con más ancho deberá estar arriba con un min-width mayor al de las otras imágenes.
Prueba de cambiar el tamaño de la ventana para comprobar que funciona.