Temas tratados en esta entrada
Elementos de imagen en HTML
Para mostrar diferentes imágenes en dispositivos como tablets, móviles, etc.
Usamos el elemento picture.
El elemento <picture> da a los desarrolladores más flexibilidad a la hora de incrustar las imágenes.
El elemento <picture> puede contener uno o más elementos <source>.
Cada elemento <source> a través de su srcset puede hacer referencia a los diferentes tamaños de imágenes.
De esta forma el navegador puede elegir la imagen que mejor se adapte a su dispositivo.
Ejemplo

Código del ejemplo
<picture> <source media="(min-width: 1200px)" srcset="https://cdn.pixabay.com/photo/2023/09/22/04/50/generated-8268031_1280.png"> <source media="(min-width: 800px)" srcset="https://cdn.pixabay.com/photo/2024/06/21/10/51/ai-generated-8844132_1280.png"> <img src="https://cdn.pixabay.com/photo/2024/06/14/21/19/summer-8830636_1280.jpg" style="height:600px"> </picture>
> ...
0 Comentarios
Si desea contactar comigo, lo puede hacer atravez deste formulario gracias